日期:2010-01-25  浏览次数:20511 次

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

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

Asp.net: <script src="<%=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. <!DOCTYPE html>   
  2.  <html>   
  3.  <head>   
  4.    <title>@ViewBag.Title</title>   
  5.   <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />   
  6.    <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>   
  7.   @RenderSection("Head", required: true)   
  8.  </head>   
  9.  <body>   
  10.   <div class="page">  

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

  1. @{   
  2.    ViewBag.Title = "Home Page";   
  3. }