MVC3.0 中Razor 学习

简介:

随着MVC3.0RTM版本的发布,最近将公司的项目从MVC2.0升级到MVC3.0。同时打算在MVC3中全面使用Razor模板引擎。现将Razor学习拿出来和大家分享,如果存在不足的地方欢迎您指出。

     其实在使用<%= %>在html中调用C#代码时,内心总在埋怨。这个写法非常麻烦。麻烦在哪呢?其实就是闭合。比如:

Asp.net: <script src="&lt;%=Url.Content("~/Scripts/jquery-1.4.4.min.js")%>"

Razor:   <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")"

非常明显,Razor在内部帮我们做了闭合“%>”。其实就是这个小小的闭合让我们可以在html内更加“流畅”的调用服务端代码。故Razor给开发带来了一定的便捷!下面介绍Razor的基本用法。

  一、模板页

       Razor出现后我们就可以选择不再使用asp.net master 模板页。取而代之的是cshtml razor的模板文件。用法个人认为还是和master模板页类似。但在mater模板页的原有功能上有了进一步扩展,更方便开发。比如只要在View文件夹内加入_ViewStart.cshtml文件,我们就无需在每一个具体的View页面引入模板页。减少View页面内的重复代码。具体的可以建立一个MVC3 Application 选择razor模板,VS会自动建立上述机制。这里值得提出的是@RenderSection方法。可以让我们在模板页预设一个区域,未来给继承该模板页的View使用。具体请看以下操作:

   在MVC3.0 shared文件夹下_Layout.cshtml这个模板文件内加入以下代码:

?

1

2

3

4

5

6

7

8

9

10

<!DOCTYPE html>

<html>

<head>

<title>@ViewBag.Title</title>

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>

@RenderSection("Head", required: true)

</head>

<body>

<div class="page">

以上代码第7行,预留出一个Head的section。 熟悉模板页的人,应该明白该处是预留是给未来具体的View页面自定义特定js/css使用的。这个View我们就用默认的Home底下的Index来举例。打开index.cshtml 写入以下代码

?

1

2

3

4

5

6

7

8

9

10

11

@{

ViewBag.Title = "Home Page";

}

<h2>@ViewBag.Message</h2>

@section Head{

<script type="text/javascript">

$(function () {

alert("hello jquery");

});

</script>

}

该View已经集成了模板页,这里只是填充模板页内的Head section这时就可以加入我们的针对每个view页面的js或者CSS了。至此达到共性外的个性。

二、Razor语法:

    文章开头就已经提到了,个人认为Razor语法的便捷在于razor自动帮助我们闭合C#或VB.NET在html的语法。请看以下代码:

已经给出注释了,仔细阅读并不难理解。您应该也能体会到如果将razor换成asp.net的<%= %>或者<%: %>写法,其实是很“痛苦”的。至于razor的其他用法官方网站已经写的很全面了,比如razor的已经为我们 HTML Encod防止XSS攻击、html中字符串中出现×××@×××.com这样的文本,Razor是可以自动识别成Email格式而不是Razor的关键字。

三、 Razor 语法智能提示:

     该智能提示与VS内的一样,只需Ctrol + J 即可调出。具体的请看下图:

您是否和我一样也打算在Web开发中全面使用Razor呢?












本文转自cnn23711151CTO博客,原文链接:http://blog.51cto.com/cnn237111/811613 ,如需转载请自行联系原作者




相关文章
|
6月前
|
设计模式 前端开发 Java
【Spring MVC】快速学习使用Spring MVC的注解及三层架构
【Spring MVC】快速学习使用Spring MVC的注解及三层架构
92 1
|
7月前
|
设计模式 存储 前端开发
Java从入门到精通:2.2.1学习Java Web开发,了解Servlet和JSP技术,掌握MVC设计模式
Java从入门到精通:2.2.1学习Java Web开发,了解Servlet和JSP技术,掌握MVC设计模式
|
7月前
|
前端开发 Java 应用服务中间件
快速上手:探索Spring MVC的学习秘籍!
快速上手:探索Spring MVC的学习秘籍!
|
7月前
|
前端开发 Java 数据库
MVC架构学习归纳总结(小傅哥の码场 学习专栏)
MVC架构学习归纳总结(小傅哥の码场 学习专栏)
42 0
|
设计模式 前端开发 Java
一篇文章让使你的Spring Mvc学习入门,还不来了解吗?
一篇文章让使你的Spring Mvc学习入门,还不来了解吗?
|
监控 前端开发 Java
学习 [Spring MVC] 的JSR 303和拦截器,提高开发效率
学习 [Spring MVC] 的JSR 303和拦截器,提高开发效率
59 0
|
设计模式 监控 前端开发
Spring MVC学习(五)-------处理器拦截器详解
Spring MVC学习(五)-------处理器拦截器详解
158 0
Spring MVC学习(五)-------处理器拦截器详解
|
XML 存储 JSON
Spring MVC详解(学习总结)
Spring MVC详解(学习总结)
Spring MVC详解(学习总结)
|
前端开发 网络协议 网络架构
Gin从入门到精通—搭建MVC项目结构学习路由配置
Gin从入门到精通—搭建MVC项目结构学习路由配置
411 0
|
前端开发 调度
学习SpringMVC必知必会(1)~MVC 思想和前端控制器思想
学习SpringMVC必知必会(1)~MVC 思想和前端控制器思想
172 0
学习SpringMVC必知必会(1)~MVC 思想和前端控制器思想