Razor代碼複用

 上一篇博客中講解了Razor語法,在這一篇博文中,我會和大家共同學習在Razor中如何複用代碼。

  1.佈局(Layout)複用

  Layout的使用,就像WebForm的模板頁一樣,甚至會更加簡單,更加方便和明瞭。

  要使用Layout,首先要在模板頁相應的位置添加@RenderBody()方法:

<!DOCTYPE html>

<html lang="en">
    <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>

  

  OK,本節就講到這裏,更多的學習內容,敬請關注

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章