如何设置和使用 Layout 视图。

添加测试页面

沿用之前的 MyWebApp 项目。

在 Controllers 文件夹下创建 HomeController：

  1. using Microsoft.AspNetCore.Mvc;
  3. namespace MyWebApp.Controllers 
  4. {
  5.     public class HomeController : Controller 
  6.     {
  7.         public IActionResult Home() => View();
  8.         public IActionResult Page1() => View();
  9.         public IActionResult Page2() => View();
  10.     }
  11. }

接下来在 Views 文件夹下的 Home 文件夹里面创建 Home、Page1、Page2 页面：

  1. Home.cshtml
  3. <h1>Home</h1>
  4. <h2>Welcome to My Website</h2>
  7. Page1.cshtml
  9. <h1>Page1</h1>
  10. <h2>Product List</h2>
  13. Page2.csthml
  15. @{ Layout = null; }
  16. <h1>Page2</h1>
  17. <h2>Order List</h2>

创建 Layout 视图页

在 Views 文件夹下创建 Shared 文件夹，然后在该文件夹下创建 _Layout.cshtml：

  1. <html>
  2.     <head>
  3.         <title>My Web App</title>
  4.     </head>
  5.     <body>
  6.         |@Html.ActionLink("Home", "Home")
  7.         |@Html.ActionLink("Page1", "Page1")
  8.         |@Html.ActionLink("Page2", "Page2")|
  9.         <hr/>
  10.         @RenderBody()
  11.         <hr/>
  12.         Copyright | @DateTime.Now.ToString()
  13.     </body>
  14. </html>

为了将该 layout 页面应用到所有视图上，可以通过在 View 文件夹下创建 _ViewStart.cshtml，并添加如下代码：

  1. @{ Layout = "_Layout"; }

运行程序并访问 http://localhost:5000/home/home。

  1. 可以看到 Home 和 Page1 中都应用了 Layout 视图

  2. 因为 Page2 使用 @{ Layout = null } 重写了 _ViewStart 里面设置的 Layout 属性值，所以没有应用 Layout