当前位置: 首页 > news >正文

[转]MVC Razor模板引擎 @RenderBody、@RenderPage、@RenderSection及Html.RenderPartial、Html.RenderAction...

本文参考自下面文章整理

MVC Razor模板引擎 @RenderBody、@RenderPage、@RenderSection及Html.RenderPartial、Html.RenderAction - kuangkro - 博客园 http://www.cnblogs.com/xlhblogs/archive/2013/06/09/3129449.html

MVC4 Razor @RenderSection -母版设置 - hcf_force的专栏 - 博客频道 - CSDN.NEThttp://blog.csdn.net/hcf_force/article/details/18702113

MVC4相关Razor语法 - hcf_force的专栏 - 博客频道 - CSDN.NET http://blog.csdn.net/hcf_force/article/details/18698751

MVC视图文件中的 @section ScriptSection{}是什么意思

如果布局页面有定义节点 @RenderSection(“ScriptSection”, required: false) ,那么在子页面中可以使用 @section ScriptSection{} 来引用js或者css。这个作用相当于在布局页中定义了一个占位,在子页面中去填充这个占位


  1. 了解ASP.NET MVC - 应用程序文件夹以及对每个文件夹内容的简要描述

  2. ASP.NET MVC - 样式和布局

<!DOCTYPE html>
<html>
<head> <meta charset="utf-8" /> <title>@ViewBag.Title</title> <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")"></script> <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")"></script> </head> <body> <ul id="menu"> <li>@Html.ActionLink("Home", "Index", "Home")</li> <li>@Html.ActionLink("Movies", "Index", "Movies")</li> <li>@Html.ActionLink("About", "About", "Home")</li> </ul> <section id="main"> @RenderBody() <p>Copyright W3schools 2012. All Rights Reserved.</p> </section> </body> </html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • HTML 帮助器 在上面的代码中,HTML 帮助器用于修改 HTML 输出: @Url.Content() - URL 内容在此处插入。 @Html.ActionLink() - HTML 链接在此处插入。

  • Razor 语法 在上面的代码中,由红色标记的代码是使用 Razor 标记的 C#。 @ViewBag.Title - 在此处插入页面标题。 @RenderBody() - 此处呈现页面内容。 您可以在我们的 
    Razor 教程中学习 C# 和 
    VB (Visual Basic) 编写的 Razor 标记。

  • _ViewStart 文件 
    Shared 文件夹(位于 Views 文件夹内)中的 _ViewStart 文件包含以下内容: @{Layout = “~/Views/Shared/_Layout.cshtml”;} 这段代码被自动添加到由应用程序显示的所有视图。 
    如果删除该文件,则必须向所有视图添加这段代码。

    这里的 @{Layout=”文件路径”;} 代码块指定了整个项目默认所使用的布局文件

  • 1
  • 1

3.假如你不想使用默认的布局,或者是你的web应用有多个页面布局文件怎么办呢

其实很简单,例如:你新建了一个view页面UserInfo.cshtml,你可以在UserInfo.cshtml文件里面写上
@{Layout = null;}
  • 1
  • 1
就可以了,这个时候就不会应用布局文件了,假如你想定义一个新的布局(依照惯例优先的原则),我们在Views/Shared下面创建一个自己的布局_MyLayout.cshtml文件,然后我们给我们创建的新页面指定如下的布局就行了:
@{ Layout = "~/Views/Shared/_MyLayout.cshtml";}
  • 1
  • 1

详情 下一篇 MVC4 利用Layout的几种方法的Demo - 钢ge的博客 - 博客频道 - CSDN.NET

4.Razor语法的分类

基本语法

@using :引入命名空间

@model:声明强类型的数据Model类型

@section:定义要实现母版页的节信息

@RenderBody():当创建基于_Layout.cshtml布局页面的视图时,视图的内容会和布局页面合并,而新创建视图的内容会通过_Layout.cshtml布局页面的@RenderBody()方法呈现在标签之间。

@RenderPage:呈现一个页面。比如网页中固定的头部可以单独放在一个共享的视图文件中,然后在布局页面中通过这个方法调用,用法如下:

@RenderPage("~/Views/Shared/_Header.cshtml")  

带参数
@RenderPage(“~/Views/Shared/_Header.cshtml”,new{parm="my",parm2="you") 调用页面获取参数: //获取 RenderPage() 传递过来的参数 @PageData["param"]
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7

@RenderSection:布局页面还有节(Section)的概念,便于局部呈现 。 
@RenderSection("scripts", required: false)第一个参数:在子页面被渲染的节的名称,第二个参数:指定子页面这个节是否是必需的,如果指定了required:true但是在子页面没有给这个名称的节的话,编译是通不过的。 
如果我们想在母版页使用默认的节可以做如下的判断:

@if(IsSectionDefined("sectionName"))   
{   
      @RenderSection("sectionName")   
}  
else { <span>默认节</span> } 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

假如子页面有这个节我们就渲染子页面的,没有的话就显示我们默认的Html块(例如:网站的头部,底部,侧边栏等等)。如果对@RenderSection还不是很理解看更详细的 MVC4 Razor @RenderSection -母版设置 - hcf_force的专栏 - 博客频道 - CSDN.NET

@Html.Partial

  • Partial 每次都会创建自己的 TextWriter 实例并且把内容缓存在内存中. 最后把所有 writer输出的内容发送到一个 MvcString对象中。更多时候我们会使用 @{ Html.RenderPartial("Details"); } 而不是@Html.Partial

@Html.RenderPartial()与 @Html.Partial的区别

  • Html.RenderPartial 直接输出至当前 HttpContext(因为是直接输出,所以性能好)。
  • Html.Partial 将视图内容直接生成一个字符串并返回(相当于有个转义的过程)。

@Html.RenderPage()和@Html.RenderPartial()的区别

  • @Html.RenderPage()调用的页面只能使用其传递过去的数据。

  • 而@Html.RenderPartial()是可以使用viewdata,model等数据的。

如:@{Html.RenderPartial("BasicChart",model);} 
  用这个重载可以在部分视图里使用强类型,然后在主视图中使用第二个参数传model过去

  @{Html.RenderPartial("BasicChart",ViewData["myData"]);}

@Html.RenderPartial和@Html.RenderAction的区别

  • Html.RenderPartial适合用在重覆使用的UserControl,并且只需要透过Model来呈现内容,或是对于广告的UserControl也适合使用。

  • Html.RenderAction则会先去呼叫Controller的Action方法,如果此UserControl是需要透过资料库取得资料来呈现(透过Action来读取资料库),此时会比较适合使用此方式。

补充:

  • 1、带有Render的方法返回值是void,在方法内部进行输出;不带的返回值类型为MvcHtmlString,所以只能这样使用: @Html.Partial 对应 @{Html.RenderPartial(….);} @Html.Action 对应 
    @{Html.RenderAction(….);}

  • 2、Html.Partial可以直接提供用户控件名作为参数,而Html.Action需要有对应的Action,在Action内部返回PartailResult(即retun 
    PartialView())。

  • 3、对于简单的没有任何逻辑的用户控件,推荐使用Html.Partial;对于需要设置一些Model的用户控件,推荐使用Html.Action。当然,有Model数据也是可以使用Html.Partial方法的,可以看方法的重载。

  • 4、使用Html.Action有个好处,就是可以根据不同的场景选择不同的用户控件。 比如: @Html.Action(“UserInfoControl”) 
    在对应的UserInfoControl这个Action中,在用户未登录的时候,可以retun 
    PartialView(“LogOnUserControl”);登录后,可以retun 
    PartialView(“UserInfoControl”);

@Html.Action() 
Partial Page Output Caching(部分页输出缓存)

我们可以使用@Html.Action()来请求一个处理方法,并将放返回的Model或者ViewModel对象渲染到页面 
这里写图片描述 
这里写图片描述 
通过使用OutputCache特性,我们实现了对对象的缓存。因此当发生重复请求时,就可以自动输出缓存信息避免频繁查询数据库,减轻服务器负担和提高响应速度

1.行内(inline)C#(服务器端代码)形式(行内代码)
    @变量例如:@User.Name,变量或属性结束后,任何形式文本或者标签都自动被解析为html,如遇结束判断有歧义,请加括号如下
    @( 表达式 )  例如:@(i + 1) 或 @(User.Name) 括号里面为:表达式,或者变量 @方法调用 例如:@Html.TextBox("UserName").ToString() 2.代码块 第一种情况: @{ 代码块 } @if (条件) { 代码块 } @switch (条件) { 分支匹配代码块 } @for (循环控制) { 代码块 } @foreach (循环控制) { 代码块 } @while (循环控制) { 代码块 } @do { 代码块} while (循环控制) 『 代码块里面的代码要严格按照c#语法来,每行结束必需有分号』 第二种情况:(代码块中的文本或者Html客户端标签) 单行文本 @:行内文本 换行的话自动变成了C#服务器端代码。 多行文本 任何标签对 例如:<div>多行文字</div> 任何自闭合标签 例如:<img 多行属性 /> 纯文字使用伪标签<text> 例如:<text>多行文字,两侧标签不会被输出</text> 3.其他 电子邮箱可以自动识别,例如:123456@qq.com 被误认为是电子邮箱的请加括号(),例如:123456(@UserName) 要输出商标版权等的,请用@字符转义,例如:@@ →会输出单个字符@ 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27

HtmlHelper和AjaxHelper

Html.BeginForm的两种写法: 
第一种使用Using语句:

@using(Html.BeginForm())  
{  

}  
  • 1
  • 2
  • 3
  • 4
  • 1
  • 2
  • 3
  • 4
@using(Html.BeginForm())  
{  

} 
  • 1
  • 2
  • 3
  • 4
  • 1
  • 2
  • 3
  • 4
第二种使用代码块闭合的形式(注意form是代码块形式
@{Html.BeginForm();}  

@{Html.EndForm();} 
  • 1
  • 2
  • 3
  • 1
  • 2
  • 3
@{Html.BeginForm();}  

@{Html.EndForm();}  
  • 1
  • 2
  • 3
  • 1
  • 2
  • 3

Ajax.BeginForm()的写法只有一种:因为我并没有看到Ajax.EndForm()。呵呵估计是微软的开发团队开发Razor引擎的时候漏掉了

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId="",OnSuccess=""})) { } 
  • 1
  • 2
  • 3
  • 4
  • 1
  • 2
  • 3
  • 4
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId="",OnSuccess=""})) { } 
  • 1
  • 2
  • 3
  • 4
  • 1
  • 2
  • 3
  • 4

这里要想Ajax的Form有效的话我们必须在view页面引入

@Scripts.Render("~/bundles/jqueryval")
  • 1
  • 1
@Scripts.Render("~/bundles/jqueryval")  
  • 1
  • 1

这个是微软的脚本捆绑技术,实际上捆绑的就是(以下的JS代码) 
这里写图片描述

不难看到其中就有ajax的JavaScript脚本 
对于AjaxForm的提交参数的指定: 
当异步请求成功时,会去使用后端返回的内容局部更新UpdateTargetId所指定的客户端的html标签内容,然后调用OnSuccess指定的客户端的JS方法。 
具体参数说明可以参照MSDN: 
OnSuccess:http://msdn.microsoft.com/zh-cn/library/system.web.mvc.ajax.ajaxoptions.onsuccess(v=vs.108).aspx 
对于Razor智能感知的一点补充 
在微软的cshtml页面,@后面跟一些对象的时候会自动出现智能感知 
这里写图片描述 
当我们自定义一个类,让后想让这个类在Razor引擎有只能感知能力的时候。我们可以找到 
Views/Web.config文件,打开文件我们会发现如下的节点:

  <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> 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
<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> 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

我们只要把我们的类所在的命名空间添加进去就可以了。

最后部分转自:http://blog.csdn.net/hcf_force/article/details/18698751

相关文章:

  • Java动态绑定机制的内幕
  • 安全公司赢取客户信任 真正依靠的是什么?
  • 《Oracle高性能自动化运维》一一第2章 Oracle内存体系结构 2.0
  • AngularJS上传下载文件及$http总结
  • 金蝶K/3 WISE ERP汇率修改小记
  • EasyBarrage——Android平台轻量级弹幕效果
  • 2、配置logstash
  • 关于硬盘分区管理mbr gpt
  • Ubuntu下安装man中文手册
  • 定位Section的FooterView
  • 第十六周oj刷题——Problem I: 改错题:类中私有成员的訪问
  • 第2章第2节练习题3 使用队列模拟渡口管理
  • Zookeeper客户端Curator---Getting Started
  • [Step By Step]SAP HANA创建属性视图(Attribute View)
  • 如何在Linux上检测硬盘上的坏道和坏块
  • 【面试系列】之二:关于js原型
  • CentOS从零开始部署Nodejs项目
  • java中具有继承关系的类及其对象初始化顺序
  • JWT究竟是什么呢?
  • Next.js之基础概念(二)
  • Redis提升并发能力 | 从0开始构建SpringCloud微服务(2)
  • Redis学习笔记 - pipline(流水线、管道)
  • socket.io+express实现聊天室的思考(三)
  • SQL 难点解决:记录的引用
  • 诡异!React stopPropagation失灵
  • 猫头鹰的深夜翻译:Java 2D Graphics, 简单的仿射变换
  • 如何编写一个可升级的智能合约
  • 实现简单的正则表达式引擎
  • 它承受着该等级不该有的简单, leetcode 564 寻找最近的回文数
  • 优化 Vue 项目编译文件大小
  • 云大使推广中的常见热门问题
  • d²y/dx²; 偏导数问题 请问f1 f2是什么意思
  • 【运维趟坑回忆录 开篇】初入初创, 一脸懵
  • Linux权限管理(week1_day5)--技术流ken
  • ​Java并发新构件之Exchanger
  • ​人工智能之父图灵诞辰纪念日,一起来看最受读者欢迎的AI技术好书
  • # 安徽锐锋科技IDMS系统简介
  • (1)STL算法之遍历容器
  • (17)Hive ——MR任务的map与reduce个数由什么决定?
  • (3)STL算法之搜索
  • (9)STL算法之逆转旋转
  • (C++17) std算法之执行策略 execution
  • (C语言版)链表(三)——实现双向链表创建、删除、插入、释放内存等简单操作...
  • (四)库存超卖案例实战——优化redis分布式锁
  • (译)计算距离、方位和更多经纬度之间的点
  • (原)Matlab的svmtrain和svmclassify
  • (转) RFS+AutoItLibrary测试web对话框
  • .NET Framework 3.5中序列化成JSON数据及JSON数据的反序列化,以及jQuery的调用JSON
  • .NET Remoting Basic(10)-创建不同宿主的客户端与服务器端
  • .net 反编译_.net反编译的相关问题
  • .net 托管代码与非托管代码
  • .NET/C# 使用 #if 和 Conditional 特性来按条件编译代码的不同原理和适用场景
  • .NetCore实践篇:分布式监控Zipkin持久化之殇
  • @transactional 方法执行完再commit_当@Transactional遇到@CacheEvict,你的代码是不是有bug!...
  • []FET-430SIM508 研究日志 11.3.31