程式師世界 >> 編程語言 >> .NET網頁編程 >> C# >> C#入門知識 >> C# Mvc.net 3.0 Razor Leyout布局視圖使用介紹

C# Mvc.net 3.0 Razor Leyout布局視圖使用介紹

編輯：C#入門知識

測試需要一個主頁入口點，這裡使用默認的路由設置就可以測試。

1.首先在默認的 homecollector 中建立一個 action，如下

    public ActionResult index()
    {
      return View();
    }

2.在 view/home 文件件下建立 MyLeyout.cshtml 視圖，內容如下

@{
//some code
}
<!DOCTYPE html>

<html>
<head>
    <title>@ViewBag.Title</title>
</head>
<body>
    <div>
        開始渲染Body<br />
        @RenderBody()
        渲染Body結束<br />
        <br />
        開始渲染 ViewPage1<br />
        @RenderPage("~/Views/Home/ViewPage1.cshtml")
        結束渲染 ViewPage1<br />
        <br />
        開始渲染 ViewPage2<br />
        @RenderPage("~/Views/Home/ViewPage2.cshtml")
        結束渲染 ViewPage2<br />
        <br />
        學習Section用法了<br />
        開始渲染Section<br />
        聲明方式1(推薦):SectionA:<br />
        @*引用頁無標記也不會異常,第二個三數如果為 true 則要求引用頁必須存在 SectionA 標簽*@
        @RenderSection("SectionA", false)
        -------<br />

        聲明方式2:SectionB:<br />
          @{
              //判斷是否存在標記 SectionB
              if (IsSectionDefined("SectionB"))
              {
                  @RenderSection("SectionB")
              }
          }
        -------<br />

        聲明方式3:SectionC:<br />
          @{
            //我們測試沒有定義過的 SectionC，頁面將出現異常
            //@RenderSection("SectionC") //測試時將注釋打開
          }
        -------<br />
        渲染Sction結束<br />
    </div>
</body>
</html>

3.在view/home 文件夾下建立一個 index.cshtm 文件，內容如下

@{
ViewBag.Title = "首頁";
Layout = "~/Views/home/MyLeyout.cshtml";
}

<div>
這裡就是渲染Body啦.
</div>

@section SectionA{
<div>這裡是SectionA：在 index 頁中聲明的</div>
}

@section SectionB{
<div>這裡是SectionB：也是在 index 頁中聲明的</div>
}

4.同上位置，建立 ViewPage1.cshtml 視圖

@{
//ViewBag.Title = "首頁";
Layout = null;
}

<div>
這裡就是渲染 viwpage1.chatml 的所有內容了
</div>

5.同上位置，建立 ViewPage2.cshtml 視圖 ,證明 RenderPage() 占位符可以多次聲明

@{
//ViewBag.Title = "首頁";
Layout = null;
}

<div>
這裡就是渲染 viwpage2.chatm2 的所有內容了
</div>
看著代碼有多又亂，看看注釋應該可以明白的