上篇博文介紹了一下Razor的基本語法,那今天看下Razor視圖怎么布局吧!
Question 網站為啥要布局?
說道布局了那么網站為什么要布局呢?不布局有什么壞處呢?好今天開始咱先說一下為什么要布局?
首先,沒有使用布局時,每個頁面都存在大量的重復代碼比如head top logo menu bottom 等等。
缺點:
1. 代碼冗余 ---> 剛才已經提到了,沒有使用布局的網站沒個頁面中必須再把比如logo head menu 等等從新copy一份,有人說我用iframe或者是include標記,我說當然可以,但是從開發規范上來看我覺得要避免使用浮動框架。
2. 不利於管理 ---> 您站點的每個文件都是單獨的一個文件而沒有統一的管理頁面(布局頁面)當然不利於管理。
3. 不利於后期修改 ---> 比如說哪天客戶需求變了,我logo看着太小我要改大點,這下完蛋了 -- 坑爹啊 每個頁面都得改。
那問題來了怎么解決呢?
傳統的webfrom中有母板頁的概念大家應該都知道吧?如有不知道的,而且至今還用frame做模板布局的快學習.net的母板吧!這比 比如iframe什么的方便多了。因為我以前就是在.net里運用iframe 慚愧慚愧 嘿嘿!!!
今天的重點:Razor 布局 : 用過MVC 2 的應該知道那里面用的是master 母板頁布局,那么MVC 3 中的布局是布局頁(Layout)其實大同小異換瓶不換葯
Razor的布局
1.不需要使用專門的.master文件,而統一使用.cshtml文件(view層中的文件都是.cshtml文件)
布局文件名一般采用類似於_Layout.cshtml的名字。細心的人看到了是下划線開頭,MVC 3會限制以下划線開頭的文件直接被用戶訪問,即此文件只能在程序中調用而不能直接被用戶訪問到,處於安全的考慮。
2. 布局文件中使用到的特殊標記
2.1 @RenderBody() 用於標識布局頁中科替換內容的主體部分。
2.2 Layout屬性:內容頁總通過給頁面的Layout屬性賦值實現指定布局頁的文件路徑。
@{ Layout = "~/Views/Shared/_Layout.cshtml"; }
2.3 @RenderSection在布局頁中預設一些區域,用於在內容也中使用。
如:布局時head標簽中的東西不能確定,或者說其他的頁面中需要一些不是公共的東西,如css文件,js文件等等那么就需要在布局頁的head標簽中加入如下代碼了 @RenderSection("head",false)
2.3.1 第一個參數是Section的名字。
2.3.2 第二個參數是用來設定是否為必須填充內容的區域。
內容也中通過@section head { ... } 的方式向名為head的section中填充內容。
3. _ViewStart 文件
我們發現在項目的試圖文件夾下有個名為_ViewStart.cshtml 的文件那這個文件是干啥的呢?該文件用來定義想要在每次視圖呈現開始時執行的通用試圖代碼,就是你每訪問一個試圖頁面之前先調用這個文件執行這個文件中的代碼然后在執行您所訪問的視圖頁面。比如我們可以將上面的每個視圖指定Layout屬性的代碼寫在這里面。
怎么樣只需要寫一次,每個視圖了就不需要在寫了,如如某個頁面的布局和_ViewStart文件中的布局不一樣怎么辦呢?好辦直接在視圖里寫對於的布局文件即可它會默認覆蓋共有的布局文件。那么如果我有好多頁面都需要一個不同的布局頁並且它們在同一個文件夾(比如網站后台admin)下那怎么辦呢?難不成要每個視圖都要知道Layout屬性嗎?不會滴 。 先說下_ViewStart文件的作用范圍:它的同級文件已經同級的子文件。所以針對上面的需求只需要在admin文件中新建一個_ViewStart文件然后在文件中指定Layout屬性就OK了。