原文:http://www.cnblogs.com/youring2/archive/2011/07/26/2115493.html

1.布局(Layout)复用

Layout的使用,就像WebForm的模板页一样,甚至会更加简单,更加方便和明了。要使用Layout,首先要在模板页相应的位置添加@RenderBody()方法:

<!DOCTYPE html>

<html>
<head>
<meta charset="utf-8"/>
<title>测试网站 - @Page.Title</title>
</head>
<body>
@RenderBody()
</body>
</html>

在要使用模板页的页面中,指定所使用的模板页:

@{
Layout = "/LayoutPage.cshtml";
Page.Title = "第一个子页面";
} <p>This is a layout test</p>

Layout的加载顺序不同于模板页,它是先加载子页,然后再加载布局页的。

2.页面(Page)复用

在Razor中,我们可以轻松的在页面中输出另一个页面的HTML代码:

<p>
@RenderPage("/SubPage.cshtml")
</p>

SubPage的代码如下:

<font color="red">这是一个子页面</font>

3.Section

Section是在布局页(Layout Page)中使用的东西,在使用了布局页的子页面中定义Section的内容,布局页才能够使用。如果Page1.cshtml页面使用了布局页Layout.cshtml,那么,我们可以在Page1.cshtml中定义Section:

@section header{
<b>Header Section</b>
} @section footer{
<b>footer Section</b>
}

Layout.cshtml的代码:

<body>
@RenderSection("header"); @RenderBody() @RenderSection("footer");
</body>

4.Helper复用

Helper是用来简化代码编写的,通常用来处理输出。例如,我们可以为一个模型构建一个Helper,用来处理该模型的Html输出;再比如,我们为系统菜单创建一个Helper,方便我们使用。

定义Helper,需要使用@helper标记,在该标记后面添加名称和相应的代码:

@helper MenuEx(params string[] strs){
<ul>
@foreach(string str in strs){
<li>@str</li>
}
</ul>
}

这种写法非常类似与类的静态方法,在这个MenuEx中,需要传递字符串数组作为参数。

另外,我们通常会把一类Helper放在一个cshtml文件中,这个文件名就相当于类名。例如MenuEx放在文件 HelperEx.cshtml文件中,在Page1.cshtml中的使用方法如下:

<p>
@HelperEx.MenuEx("Microsoft", "IBM", "Apple", "Google")
</p>

这是我们自定义的内容,另外,系统还为我们提供了一些列的Helper,用来简化Html的书写。这些Helper放在@Html中,我们可以方便的使用:

<p>
@Html.TextBox("txtName")
</p>

Razor之代码复用的更多相关文章

  1. if __name__== "__main__" 的意思(作用)python代码复用

    if __name__== "__main__" 的意思(作用)python代码复用 转自:大步's Blog  http://www.dabu.info/if-__-name__ ...

  2. Atitit 代码复用的理解attilax总结

    Atitit 代码复用的理解attilax总结 1.1. 继承1 1.1.1. 模式1:原型继承1 1.1.2. 模式2:复制所有属性进行继承 拷贝继承1 1.1.3. 模式3:混合(mix-in)1 ...

  3. javascript 模式(1)——代码复用

    程序的开发离不开代码的复用,通过代码复用可以减少开发和维护成本,在谈及代码复用的时候,会首先想到继承性,但继承并不是解决代码复用的唯一方式,还有其他的复用模式比如对象组合.本节将会讲解多种继承模式以实 ...

  4. HTML 代码复用实践 (静态页面公共部分提取复用)

    原文:HTML 代码复用实践 上面的链接里面安装配置步骤已经非常详细,这里主要记录我操作过程中遇到的几个问题 gulp-file-include 的使用     按上面的步骤安装之后,node_mod ...

  5. 《JavaScript模式》第6章 代码复用模式

    @by Ruth92(转载请注明出处) 第6章:代码复用模式 GoF 在其著作中提出的有关创建对象的建议原则: -- 优先使用对象组合,而不是类继承. 传统模式:使用类继承: 现代模式:"类 ...

  6. javascript代码复用(四)-混入、借用方法和绑定

    这篇继续说js的现代复用模式:混入.借用方法和绑定. 混入 可以针对前面提到的通过属性复制实现代码复用的想法进行一个扩展,就是混入(mix-in).混入并不是复制一个完整的对象,而是从多个对象中复制出 ...

  7. javascript代码复用模式(二)

    前面说到,javascript的代码复用模式,可分为类式继承和非类式继承(现代继承).这篇就继续类式继承. 类式继承模式-借用构造函数 使用借用构造函数的方法,可以从子构造函数得到父构造函数传任意数量 ...

  8. javascript代码复用模式

    代码复用有一个著名的原则,是GoF提出的:优先使用对象组合,而不是类继承.在javascript中,并没有类的概念,所以代码的复用,也并不局限于类式继承.javascript中创建对象的方法很多,有构 ...

  9. 代码复用 -- 深入了解javascript

    /* 代码复用 */ /* 一.避免 */ /* 模式1:默认模式 */ function Parent() { this.name = "123"; } Parent.proto ...

随机推荐

  1. 解决Unable to resolve superclass的问题

    之前在GITHUB上看到大蛋的高级设置,昨晚于是就拿来编译.. 结果真是个悲伤的故事,放手机上居然运行不了,这种时候只能看LOG了! 看LOG得出的信息如下: - ::): threadid=: in ...

  2. Unity Scripting Tutorials 要点记录

    (搬运自我在SegmentFault的博客) 这几天通过Unity官网的Unity Scripting Tutorials的视频学习Unity脚本,观看的过程中做了记录.现在,整理了一下笔记,供自己以 ...

  3. 关于使用 Connect-Busboy 实现文件上传 优化说明

    这篇博文完全上关于上一篇的优化 先看上一篇 node.js 在 Express4.0 框架使用 Connect-Busboy 实现文件上传 因为从上次博客改用 connect-busboy 来上传文件 ...

  4. SQL中的内连接外连接和交叉连接是什么意思?

    内连接又分为等值连接.自然连接和不等连接三种. 外连接分为左外连接(LEFT OUTER JOIN或LEFT JOIN).右外连接(RIGHT OUTER JOIN或RIGHT JOIN)和全外连接( ...

  5. Linux: uid/euid/suid的关系

    三种进程用户的简单解释:三种用户/组ID:uid/gid: 实际用户/组IDeuid/egid: 有效用户/组ID, 进程执行某个应用的用户/组ID.suid/sgid: 设置用户/组ID, 应用所属 ...

  6. Knockout.Js学习目录

    1.Knockout.Js(简介) 2.Knockout.Js(监控属性Observables) 3.Knockout.Js(属性绑定) 4.Knockout.Js(事件绑定) 5.Knockout. ...

  7. 【转】VNC配置

    配置VNC服务参数文件 编辑vncservers文件追加如下 #vi /etc/sysconfig/vncsevers VNCSERVERS="1:root" VNCSERVERA ...

  8. Awesome Swift

    Awesome Swift https://github.com/matteocrippa/awesome-swift A collaborative list of awesome Swift re ...

  9. 30.DDR2问题2_local_init_done为什么没拉高?

    按照初始化时序,在200us时,mem_clk时钟稳定,开始初始化设置,设置完后,会产生一个初始化完成标志,local_init_done会拉高,没有拉高,可能有以下几个原因: 1.确认DDR2 IP ...

  10. Java实现Socket之TimeClient

    Java实现Socket之TimeClient 代码内容 从time.nist.gov服务器的37号端口得到时间信息,并对时间进行解析后显示出来 代码实现 /* TimeClient.java */ ...