MVC之路随记2--Razor基础

浏览数：22 / 时间：2015年06月09日

1.概述:Razor是mvc 3.0新扩展的内容,是默认的视图引擎,引擎一词可理解为Web Form中<% %>中的变形,但是Razor更加干净,轻量级,简单.使用了该引擎后,文件的后缀名将是cshtml(c#)或vbhtml(vb).

2.基本使用方法

@* 代码表达式 *@
<h2>hello @ViewBag.Msg</h2>
@* 显式方式输出 *@
@{
    string str = "hello world";
}
<h1>@(str).model</h1>
@*识别邮件地址*@
<span>[email protected]</span>
@*有歧义时要用显式输出格式*@
<span>stringLeng@(str.Length)</span>
@*输出‘@‘符号时*@
<span>@@孙猴子@@</span>

@*遇上Html编码时,Razor会自动看为字符串,以此防止XSS攻击
,但是最好的方式是用‘@Ajac.JavaScriptStringEncode‘方法对用户输入进行编码来防止注入*@
@{
    string str2 = "<script>alert(‘xss hack‘)</script>";
 }
 <h2>@str2</h2>
 @*若要当成HTML输出亦可*@
 <h1>@Html.Raw(str2)</h1>
 
 @*代码块自动识别结尾*@
@foreach(LogOnModel l in Model)
{
     <p>@l.UserName</p>
}
@*混合代码和纯文本*@
@if (true)
{
    <text>This a plain text</text> 
}
@if (true)
{
    @:This is  a plain text! 
}

3.深入理解使用

3.1布局

Razor的布局方式使多个视图能够保持一样的外观

MVC 3.0+会自动生成一个_ViewStart视图文件,他会先于所有视图运行,里面就定义了布局文件

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

 打开布局文件可以看到

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; 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.4.4.min.js")" type="text/javascript"></script>
</head>

<body>
    <div class="page">

        <div id="header">
            <div id="title">
                <h1>我的 MVC 应用程序</h1>
            </div>

            <div id="logindisplay">
                @Html.Partial("_LogOnPartial")
            </div>

            <div id="menucontainer">

                <ul id="menu">
                    <li>@Html.ActionLink("主页", "Index", "Home")</li>
                    <li>@Html.ActionLink("关于", "About", "Home")</li>
                </ul>

            </div>
        </div>

        <div id="main">
            @RenderBody()
            <div id="footer">
            @if (IsSectionDefined("footer"))
            {
                //渲染页脚
                RenderSection("footer");
            }
            else {
                <span>This is the default footer.</span>
            }
            </div>
        </div>
    </div>
</body>
</html>

其中@RenderBody()放置视图文件中的内容,若是有页脚则放置在RenderSection("footer"),这两个方法说白了就是一个占位符,对于默认的视图是没有页脚的,我们可以为视图加上页脚,如下代码

 @RenderSection("Footer",false);

其中false是指不一定非要加页脚不可.他有两个重载,若是没设置第二个参数,或者第二个参数设置为true,则在视图中必须设置对应的渲染内容@section

视图中使用

@section Footer{
    This is A <strong> Footer</strong>
}

说到布局,就还要说个@RenderPage("/url.."),他在布局文件中使用,可以指定渲染的页面到布局中来.

@RenderPage("~/Views/Home/About.cshtml");

 

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style log com 代码 使用 src http java class style log com 代码 使用 src http java

相关文章

随机文章

您可能还喜欢

您可能还喜欢