上一篇部落格中講解了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>
上一篇部落格中講解了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>