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，本節就講到這里，更多的學習內容，敬請關注！

posted @ 2011-07-26 09:59 拓荒者IT 閱讀(6812) 評論(4) 收藏舉報

刷新頁面返回頂部

拓荒者

Razor代碼復用

公告