MVC3/4/5/6 布局页及Razor语法及Route路由配置
一、目录结构
二、Razor语法
代码块：@{}，如：@{Html.Raw(“”);}
@if(){}
@switch(){}
@for(){}
@foreach(){}
@while(){}
@do{}while(){}
代码块内语句以分号结束
表达式或变量：以@开始，如：@User.Name或@(User.Name + “欢迎你”)，@()
变量可以通过var来声明，且只能在代码块中，如：@{var abc=”aaa”;}
方法调用：以@开始，如：@Html.Encode(“”)
单行文本输出：@: 直接输出后面的文本
多行文本输出：使用任意标签 <span>文本内容</span>
电子邮箱可以自动识别：tyh@sina.com
如果误认为是邮箱可以tyh@(UserName)
输出@符号：@@ 会输出一个@符
三、布局页
~/Views/_ViewStart.cshtml是所有视图页（不含局部试图页）启动时都会引用的页面，里面写了默认的布局页地址：
Layout = "~/Views/Shared/_Layout.cshtml";
~/Views/Shared/_Layout.cshtml是整个项目默认的布局页：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>@ViewBag.Title</title>
@*加载CSS*@
@RenderPage("~/Views/Shared/_CSS.cshtml")
@*自定义CSS：可以由内容页自行选择填充*@
@RenderSection("CustomCSS")
@*自定义头部JS：可以由内容页自行选择填充*@
@RenderSection("CustomJS_Header", false)
</head>
<body>
@*加载Header*@
@RenderPage("~/Views/Shared/_Header.cshtml")
@*加载Body 内容页面填充内容*@
@RenderBody()
@*加载Footer*@
@RenderPage("~/Views/Shared/_Footer.cshtml")
@*加载JS*@
@RenderPage("~/Views/Shared/_JS.cshtml")
@*自定义脚部JS：可以由内容页自行选择填充*@
@RenderSection("CustomJS_Footer", false)
@*判断内容页是否已呈现此节点，如已呈现则显示，未则显示默认*@
@if (IsSectionDefined("ReplaceableContent"))
{
@RenderSection("ReplaceableContent")
}
else
{
<h1>我是默认的可替换节点</h1>
}
</body>
</html>
RenderPage(“页面地址”):呈现某一页面的内容，一般用来加载页头和页脚
RenderSection(“节点名称”,内容页是否必须呈现):定义个节点，由内容页面去选择呈现里面的内容
RenderBody():内容页面的所有内容都会渲染到这个位置，相当于一个内容页的占位符
IsSectionDefined:检查内容页是否已经呈现了此节点，是就呈现内容页面的节点，否就显示默认的
MVC对名称以下划线开头的文件都设置无法通过Web来单独请求浏览，如下：
_Layout.cshtml
_Header.cshtml
_Footer.cshtml
根目录："~/"代表虚拟根目录，"/"代表根目录，如：View("~/Views/Home/About.cshtml");
四、视图页
@{
ViewBag.Title = "Index";
//Layout = null;//每个页面可以单独指定布局页
}
@using System.Data.Common
@model System.String
@section CustomCSS
{
<style>
div {
height: 20px;
margin: 10px 10px 10px 10px;
}
</style>
}
@section CustomJS_Header
{
<script type="text/javascript">
(function testHeaderFun() {
console.log("js_header");
})();
</script>
}
@section CustomJS_Footer
{
<script type="text/javascript">
(function testFooterFun() {
console.log("js_footer");
})();
</script>
}
<div style="border: 1px solid purple">
我是Body
@Model.Length
@{ Html.Raw("");}
@{ Html.RenderAction("ActionPartial", "Home");}
@{ Html.RenderPartial("ViewPartial");}
@Html.Action("ActionPartial","Home")
@Html.Partial("ViewPartial")
</div>
Layout属性可以定义当前页是否有引用布局页NULL为不引用，也可以定义引用其他的布局页：Layout = "~/Views/Shared/_Layout_NoLogin.cshtml";
使用using引入命名空间：@using System.Data.Common
设置Action返回的return View(“”)的数据类型：@model
页面中使用@model首字母大写的：@Model
实现布局页的自定义节点：@section 节点名{} 如：@section CustomCSS{}
输出HTML内容：默认MVC是对HTML标签进行编码为了防止XSS攻击，如果想输出标签使用@Html.Raw(“”)
引入局部试图：
1、 需要请求后台Action：（Action上可以加ChildActionOnly标签防止独立访问）
@Html.Action("ActionPartial","Home")
@{ Html.RenderAction("ActionPartial", "Home");}
2、 直接加载View
@Html.Partial("ViewPartial")
@{ Html.RenderPartial("ViewPartial");}
两者的区别在于前者返回MvcHtmlString对象在解析到当前页，直接调用即可，后者直接将内容输出到TextWriter中，需要代码块调用，理论上后者比前者少一次转换应该性能稍好一点，不过这太微小了。
五、其他
MVC还有三种交互数据的方法
ViewData：字典类型（Dictionary），由Action向View传递数据，生命周期只在当前View，以ViewData[“Key”]方式来存取值，for手动转换类型；
ViewBag：动态类型（dynamic），由Action向View传递数据，生命周期只在当前View，以ViewBag.Key来存取值，for不需要转换类型，底层本质还是ViewData只不过多了层Dynamic控制；
TempData：字典类型（Dictionary），可以在任何Action和View中传递数据，生命周期在调用一次后自动删除，以TmpData[“Key”]方式来存取值，for手动转换类型；
Razor智能感知：
在cshtml页@后面会出现智能提示，如果我们定义一个类，又在View中想智能提示这个类的信息，就在View/Web.config文件，打开会发现以下节点：
<system.web.webPages.razor>
<host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
<pages pageBaseType="System.Web.Mvc.WebViewPage">
<namespaces>
<add namespace="System.Web.Mvc" />
<add namespace="System.Web.Mvc.Ajax" />
<add namespace="System.Web.Mvc.Html" />
<add namespace="System.Web.Optimization"/>
<add namespace="System.Web.Routing" />
</namespaces>
</pages>
</system.web.webPages.razor>
只要把想用的类所在的命名空间添加进去即可，如同using一样；
OutputCache输出缓存：
通过使用OutputCache特性，我们实现了对对象的缓存。因此当发生重复请求时，就可以自动输出缓存信息避免频繁查询数据库，减轻服务器负担和提高响应速度
[HttpGet]//设置只允许Get或Post请求
public ActionResult Index(int id)
{
ViewData["ID"] = id;
ViewBag.ID = id;
TempData["ID"] = id;
return View(String.Empty);
} [OutputCache(Duration = )]//设置页面输出缓存
[ChildActionOnly]//定义此Action只能由子操作调用
public ActionResult ActionPartial()
{
return PartialView();
}
六、Route路由
//系统生成配置
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
/*
* 自定义伪静态路由
* name:路由唯一名称
* url:路由匹配地址格式(就是url地址的访问形式，如：http://www.test.com/home/about.html)
* {controller}:控制器占位符，代表此处可替换为任意控制器名称
* {action}:功能占位符，代表此处可替换为任意一个该控制器下的action名称
* defaults:设置默认值，默认满足上面url规则地址的请求应该访问那个controller和action
*/
routes.MapRoute(
name: "Default_Html",
url: "{controller}/{action}.html",
defaults: new { controller = "Home", action = "Index" }
);
/*
* MVC默认路由
* name:路由唯一名称
* url:路由匹配地址格式(就是url地址的访问形式，如：http://www.test.com/home/index)
* {controller}:控制器占位符，代表此处可替换为任意控制器名称
* {action}:功能占位符，代表此处可替换为任意一个该控制器下的action名称
* {id}:参数占位符，代表此位置的参数，参数名为id，action中使用id接收，url不需要写id=xxx
* defaults:设置默认值，默认满足上面url规则地址的请求应该访问那个controller和action
* id = UrlParameter.Optional:代表该参数为可选参数，可以不传递
*/
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
上面只是简单的路由解释，他还有很多复杂的操作，在此不作解释了，可以参照这篇文章：http://www.cnblogs.com/TomXu/p/4496462.html
路由匹配可以使用RouteDebugger.dll来调试，NuGet包可以添加，如果无法添加，只能自行搜索下载RouteDebugger2.1.3，下载后添加引用到项目，NuGet应该可以自行添加配置节点，添加引用的在web.config中添加以下两个节点
<!--true/false代表启用禁用-->
<appSettings>
<add key="RouteDebugger:Enabled" value="true" />
</appSettings>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
</system.webServer>
运行程序，显示结果如下：
MVC3/4/5/6 布局页及Razor语法及Route路由配置的更多相关文章
- 知识点2-5：了解Razor语法
以往开发ASP.NET Web Form时,在ASPX页面上都会出现许多夹杂C#/VB.NET与HTML的情况,而先前使用<%...%>这种传统圆角括号的表示法会让HTML标签与ASP.N ...
- 5.3 Razor语法基础
以往开发ASP.NET Web Form时,在ASPX页面上都会出现许多夹杂C#/VB.NET与HTML的情况,而先前使用<%...%>这种传统圆角括号的表示法会让HTML标签与ASP.N ...
- 爱上MVC3~布局页的继承与扩展
回到 目录 在MVC3中引入了Razor引擎,这对于代码的表现力上是个突破,同时母板页也变成了_Layout,所以,我们就习惯上称它为布局页面,在razor里,布局页面是可以继承的,即,一个上下公用的 ...
- ASP.Net MVC 布局页 模板页 使用方法详细说明
一.Views文件夹 -> Shared文件夹下的 _Layout.cshtml 母版页 @RenderBody 当创建基于_Layout.cshtml布局页面的视图时,视图的内容会和布局页面合 ...
- MVC学习系列5--Layout布局页和RenderSection的使用
我们开发网站项目的时候,都会遇到这样的问题:就是页面怎么统一风格,有一致的外观,在之前ASP.NET的时代,我们有两种选择,一个是使用MasterPage页,一个是手动,自己在每个页面写CSS样式,但 ...
- MVC教程八：母版页(布局页)视图
一.母版页介绍和使用 母版页的扩展名为".cshtml",也叫做视图布局页,它相当于网页的模板.在其他网页中,只要引用了母版页,母版页的页面内容就可以自动显示出来,设计者可以修改引 ...
- 【asp.net core 系列】5 布局页和静态资源
0. 前言 在之前的4篇的内容里,我们较为详细的介绍了路由以及控制器还有视图之间的关系.也就是说,系统如何从用户的HTTP请求解析到控制器里,然后在控制器里处理数据,并返回给视图,在视图中显示出来.这 ...
- ASP.NET MVC在布局页上使用模型(model)
看到这标题有点怪,一般情况之下,我们很容易在视图与部分视图中使用模型(model),但是如果想在布局页_Layout.cshtml页中使用模型(model),按照普通方式也许没有达到预期的效果,在实现 ...
- SharePoint 2013 设置自定义布局页
在SharePoint中,我们经常需要自定义登陆页面.错误页面.拒绝访问等:不知道大家如何操作,以前自己经常在原来页面改或者跳转,其实SharePoint为我们提供了PowerShell命令,来修改这 ...
随机推荐
- SQL菜鸟学习札记（二）
五月份一直在写SQL,之后写了一个期末大作业的项目,现在才有时间把之前遇到的各种奇怪的问题整理出来.下一部分札记应该是大作业中使用到的SQL的整理. 一.UPDATE SET语句后面可以并列赋值. 之 ...
- ASP.NET Excel导入Sql Server数据库（转）
先看界面图 实现的基本思想: 1,先使用FileUpload控件fuload将Excel文件上传到服务器上得某一个文件夹. 2,使用OleDb将已经上传到服务器上的Excel文件读出来,这里将Exce ...
- error: The requested URL returned error: 401 Unauthorized while accessing
我遇到的其中一个问题. 问题描述: 在git push -u origin master是,提示“error: The requested URL returned error: 401 Unauth ...
- SNS团队第一次站立会议（2017.04.22）
一.当天站立式会议照片 本次会议主要内容:进一步明确了团队中各个成员的定位,说明了下一步团队工作的方向 二.每个人的工作 成员 昨天已完成的工作 今天计划完成的工作 罗于婕 系统架构设计及项目数据库设 ...
- 【Alpha阶段】第二次scrum meeting
每日任务: ·1.本次会议为第二次Meeting会议: ·2.本次会议于今日上午08:30第五社区五号楼下召开,会议时长15min. 一.今日站立式会议照片: 二.每个人的工作: 三.工作中遇到的困难 ...
- 个人作业2 英语学习APP分析
选用pc版的必应词典做个分析,其首页如下所示: 第一部分 调研.评测 1.第一次使用时,首页给我的印象不错,简约,不像有道看起来那么臃肿. 就个人而言,功能不需要太多,我主要利用词典查查单词和翻译句子 ...
- Swing-布局管理器应用--WIN7上计算器的UI实现
学完了Swing布局管理器,为了加深理解我决定做一些UI的实现,那就从WIN7上的计算器开始吧!首先,我们来研究一下它的UI.该计算器的UI主要有3个,分别是标准型.科学型和程序员型,如下图所示. ...
- 201521123035《Java程序设计》第一周学习总结
1.本周学习总结 本周学习了Java从诞生到如今的部分历史,并通过了老师的课堂演示了解了Java在cmd中的编译过程.然后还学习了JDK,JRE,JVM. 2. 书面作业 1.为什么java程序可以 ...
- 201521123079 《Java程序设计》第1周学习总结
1. 本周学习总结 了解学习了JAVA的开发环境的基础内容以及JDK,JRE等,学会用eclipse编写简单的代码 2. 书面作业 Q1.为什么java程序可以跨平台运行?执行java程序的步骤是什么 ...
- 201521123024 《Java程序设计》第1周学习总结
一．本周章学习总结 1.Java的版本迁移 2.运用eclipse和notepad++编写Java 3.对JDK,JRE,JVM有初步的了解 二．书面作业 1.为什么java程序可以跨平台运行?执行j ...