asp.net-mvc 如何使用 MVC3 Razor 布局页面？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6018362/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to layout a page with MVC3 Razor?
提问by vtortola
I've been reading about layouts, sections, views and partial views, but I don't really know how to approach a layout like this example:
我一直在阅读有关布局、部分、视图和部分视图的内容，但我真的不知道如何处理这样的布局：
Top bar: would be like the bar that Facebook have on top. I would contain the authentication information and general options and menus.
Navigation bar: would contain information about where are you, and where can you go. Also a "search" box.
Body: The actual wanted information.
Side bar: would contain relevant information about what is in the body.
Footer: copyright, licence and things like that.
顶部栏：就像 Facebook 在顶部的栏。我将包含身份验证信息和一般选项和菜单。
导航栏：将包含有关您在哪里以及您可以去哪里的信息。还有一个“搜索”框。
正文：实际想要的信息。
侧边栏：将包含有关正文内容的相关信息。
页脚：版权、许可和诸如此类的东西。
Bodywould be a "View", Sidebarwould be a "Section", Footerwould be static HTML in the "Layout", but... what would be Topbar and Navigation?
正文将是“视图”，侧边栏将是“部分”，页脚将是“布局”中的静态 HTML，但是……什么是顶部栏和导航？
Top baris not related with anything, so I would put it as a "Partial View" in the "Layout", but I cannot do that because it has to be inside the <body>anyway, so when I call @RenderBody(), it should be rendered. Same thing with Navigation, it's somehow related with the body, but I'd like to separate it as an external control that runs on his own and show information depending on the information in the URL.
顶栏与任何内容无关，因此我将其作为“布局”中的“局部视图”，但我不能这样做，因为<body>无论如何它都必须在里面，所以当我调用时@RenderBody()，它应该被渲染。与Navigation相同，它以某种方式与 body 相关，但我想将其分离为一个独立运行的外部控件，并根据 URL 中的信息显示信息。
How should I approach this?
我应该如何处理这个问题？
UPDATE, please read:The question is notabout CSS and HTML, it's not about how to layout this, but how to use the Razor tools to do it, it's about Razor RenderBodyand PartialView.
更新，请阅读：问题不在于 CSS 和 HTML，也不在于如何布局，而在于如何使用 Razor 工具来做到这一点，而在于 RazorRenderBody和PartialView.
When I return a result from my controller, I want to return just what is marked in the picture as "body", and "side bar" as a section, I'd like to avoid repeat the top bar code. Is there a way to create a "ChildView", that inherits from "ParentView", and this from "Layout", in a way that when I return "View("ChildView") the screen is built automatically?
当我从控制器返回结果时，我只想返回图片中标记为“正文”和“侧栏”作为一个部分的内容，我想避免重复顶部条码。有没有办法创建一个“ChildView”，它继承自“ParentView”，而这个继承自“Layout”，当我返回“View(“ChildView”) 时，屏幕会自动构建？
采纳答案by rycornell
Check out the MVC3 Music Store Tutorial
The last part of that tutorial describes how design the layout to include partial views using the Html.RenderAction() method. Also see the Html.RenderSection() method.
该教程的最后一部分描述了如何使用 Html.RenderAction() 方法设计布局以包含部分视图。另请参阅 Html.RenderSection() 方法。
回答by Thiago Azevedo
There is a great post about Layouts with Razor: ASP.NET MVC 3: Layouts with Razor.
有一篇关于 Layouts with Razor 的好文章：ASP.NET MVC 3: Layouts with Razor。
Basically your structure will be:
1) _ViewStart.cshtml (that will point to a layout and other things that all of yours views would share);
2) A .cshtml that would be your layout, ie.: _Layout.cshtml (similar to the Site.Master webpages).
基本上你的结构将是：
1）_ViewStart.cshtml（它会指向一个布局和其他你所有的视图都会共享的东西）；
2) .cshtml 将是您的布局，即：_Layout.cshtml（类似于 Site.Master 网页）。
Inside _Layout.cshtml you'll put your HTML layout, like this for example:
在 _Layout.cshtml 中，您将放置 HTML 布局，例如：
<body>
<div id="maincontainer">
<div id="topsection">
<div class="topbar">
<h1>Header</h1>
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
</div>
<div class="nav">
<ul><li>Home</li></ul>
</div>
</div>
<div id="contentwrapper">
<div id="contentcolumn">
<div class="body">
@RenderBody()
</div>
</div>
</div>
<div id="sidebar">
<b>Side bar</b>
</div>
<div id="footer">Footer</div>
</div>
</body>
See that I put @RenderBody() inside the div "#body", so when my controller return an ActionResult, only this div will be updated with the result.
看到我把 @RenderBody() 放在 div "#body" 里面，所以当我的控制器返回一个 ActionResult 时，只有这个 div 会用结果更新。
