浅谈ASP.NET Core 2.0 布局页面(译)
本文介绍了ASP.NET Core 2.0 布局页面，分享给大家，具体如下：
问题
如何在ASP.NET Core 2.0项目中共享可见元素、代码块和指令？
答案
新建一个空项目，首先添加GreetingService服务和UserViewModel模型：
public interface IGreetingService
{
string Greet(string firstname, string surname);
}
public class GreetingService : IGreetingService
{
public string Greet(string firstname, string surname)
{
return $"Hello {firstname} {surname}";
}
}
然后在Startup中添加MVC服务和GreetingService服务，配置MVC中间件：
public void ConfigureServices(IServiceCollection services)
{
services.AddScoped<IGreetingService, GreetingService>();
services.AddMvc();
}
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action=Index}/{id?}");
});
}
添加控制器HomeController，修改Index方法并返回ViewResult：
public class HomeController : Controller
{
public IActionResult Index()
{
var model = new UserViewModel
{
Firstname = "Tahir",
Surname = "Naushad"
};
return View(model);
}
}
添加布局页面（_Layout.cshtml）：
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
</head>
<body>
<div>
<h1>I'm in Layout page</h1>
@RenderBody()
@RenderSection("footer", required: false)
@if (IsSectionDefined("links"))
{
@RenderSection("links", required: false)
}
else
{
<em>No social media links supplied</em>
}
</div>
</body>
</html>
添加视图，注意遵守命名约定（Views/Home/Index.cshtml）：
@model UserViewModel
@{
ViewBag.Title = "ASP.NET Core";
}
<h2>I'm in View page</h2>
<p>@Greeter.Greet(@Model.Firstname, @Model.Surname)</p>
@section footer{
<h3>I'm in footer section</h3>
}
@*
@section links{
<a href="http://www.cnblogs.com/sanshi/" rel="external nofollow" target="_blank">Blog</a>
}
*@
添加导入页面（_ViewImports.cshtml）：
@using LayoutPage.Models @inject IGreetingService Greeter
添加起始页面（_ViewStart.cshtml）：
@{
Layout = "_Layout";
}
完成后的目录结构如下所示：
运行，此时页面显示：
讨论
ASP.NET Core提供了在不同视图之间重用可见元素和公共代码的方法：
1. 布局页面
2. 起始页面
3. 导入页面
布局页面（_Layout.cshtml）
布局页面用来在不同的页面之间共享公共的可见元素，从而为整个应用程序提供一致的外观和使用体验。
布局页面会被添加到Views/Shared目录并且命名为_Layout.cshtml（约定规则）。可以在一个应用程序中放置多个布局页面。
视图拥有一个Layout属性来设置需要使用哪个布局。ASP.NET Core会首先在视图相关的文件夹查找布局，如果未找到就会在Shared目录查找。布局页面调用@RenderBody方法来渲染视图的内容。
如果把_Layout.cshtml删除，我们可以从异常信息中看到查找路径的顺序：
布局页面也可以使用@RenderSection来决定使用视图中的哪个段落来替换。这些段落可以是必须的或者可选的。视图使用@section来定义这些段落的内容。布局页面可以使用IsSectionDefined来判断视图中是否定义了某个段落，并根据判断结果进行相应的处理：
@if (IsSectionDefined("links"))
{
@RenderSection("links", required: false)
}
else
{
<em>No social media links supplied</em>
}
导入页面（_ViewImports.cshtml）
我们曾经在前面的文章中讨论过，视图可以使用指令来做很多事情，比如导入命名空间（@using），注入依赖项（@inject）和声明模型类型（@model）。MVC还提供了一个导入页面来为一个或者多个视图声明公共的指令。
导入页面一般被添加到Views目录并且被命名为_ViewImports.cshtml。它也可以被添加到其他目录（比如视图目录），这种情况下它会被应用到此目录下面的视图（包含子目录）。
如果存在多个导入页面，则使用最靠近视图的指令（比如@model，@inject），另一种情况是所有指令被合并到一起（比如@using，@addTagHelper）。
起始页面（_ViewStart.cshtml）
MVC提供了一种在所有视图之前之前运行代码的机制，这就是起始页面。起始页面会在每一个视图之前运行，除了布局页面和部分视图。
起始页面一般被添加到Views目录并且被命名为_ViewStart.cshtml。如果存在多个起始页面，它们会按照分层顺序执行，从根目录到子目录。
起始页面常用来为目录下的所有视图设置布局页面。
源代码下载
原文：https://tahirnaushad.com/2017/08/23/asp-net-core-2-0-mvc-layout-pages/
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
ASP.NET Core 2.0 本地文件操作问题及解决方案
问题 如何在ASP.NET Core 2.0中受限地访问本地目录和文件信息? 答案 新建一个空项目,修改Startup类,添加访问本地文件所需的服务: public void ConfigureServices(IServiceCollection services) { services.AddSingleton<IFileProvider>( new PhysicalFileProvider(Directory.GetCurrentDirectory())); } 创建一个中间件,读取根目
-
[译]ASP.NET Core 2.0 路由引擎详解
本文介绍了ASP.NET Core 2.0 路由引擎详解,分享给大家,具体如下: 问题 ASP.NET Core 2.0的路由引擎是如何工作的? 答案 创建一个空项目,为Startup类添加MVC服务和请求中间件: public void ConfigureServices(IServiceCollection services) { services.AddMvc(); } public void Configure(IApplicationBuilder app, IHostingEnvir
-
ASP.NET Core 2.0 带初始参数的中间件问题及解决方法
问题 如何在ASP.NET Core 2.0向中间件传入初始参数? 答案 在一个空项目中,创建一个POCO(Plain Old CLR Object)来保存中间件所需的参数: public class GreetingOptions { public string GreetAt { get; set; } public string GreetTo { get; set; } } 添加一个中间件: public class GreetingMiddleware { private readon
-
[译]ASP.NET Core 2.0 网址重定向的方法
问题 如何在ASP.NET Core 2.0中实现网址重定向? 答案 新建一个空项目,在Startup.cs文件中,配置RewriteOptions参数并添加网址重定向中间件(UseRewriter): public void Configure(IApplicationBuilder app, IHostingEnvironment env) { var rewrite = new RewriteOptions() .AddRedirect("films", "movies
-
详解ASP.NET Core 2.0 视图引擎(译)
问题 如何在ASP.NET Core 2.0中使用Razor引擎来创建视图? 答案 新建一个空项目,修改Startup.cs,添加MVC服务和请求中间件: public void ConfigureServices(IServiceCollection services) { services.AddMvc(); } public void Configure(IApplicationBuilder app, IHostingEnvironment env) { if (env.IsDevelo
-
ASP.NET Core 2.0 支付宝扫码支付的实现代码
前言 自从微软更换了CEO以后,微软的战略方向有了相当大的变化,不再是那么封闭,开源了许多东西,拥抱开源社区,.NET实现跨平台,收购xamarin并免费提供给开发者等等.我本人是很喜欢.net的,并希望.net core能够崛起.我是从.net core 1.1的时候开始使用的,到现在的.net core 2.0..net core 2.0比1.1有了一些改变,api也增加了很多,用着更顺手了,最近在做asp.net core 对接支付宝,百度了一下没找到关于core的支付宝支付相关资料,所以
-
浅谈ASP.NET Core 2.0 中间件（译）
问题 如何创建一个最简单的ASP.NET Core中间件? 答案 使用VS创建一个ASP.NET Core 2.0的空项目,注意Startup.cs中的Configure()方法: public void Configure(IApplicationBuilder app, IHostingEnvironment env) { app.Run(async (context) => { await context.Response.WriteAsync("Hello World! (Run)
-
ASP.NET Core 2.0 使用支付宝PC网站支付实现代码
前言 最近在使用ASP.NET Core来进行开发,刚好有个接入支付宝支付的需求,百度了一下没找到相关的资料,看了官方的SDK以及Demo都还是.NET Framework的,所以就先根据官方SDK的源码,用.NET Standard 2.0 实现了支付宝服务端SDK,Alipay.AopSdk.Core(github:https://github.com/stulzq/Alipay.AopSdk.Core) ,支持.NET CORE 2.0.为了使用方便,已上传至Nuget可以直接使用. 支付
-
详解ASP.NET Core 2.0 路由引擎之网址生成(译)
问题 如何在ASP.NET Core 2.0中由路由引擎来生成网址? 答案 新建一个空项目,修改Startup.cs文件,添加MVC服务和中间件: public void ConfigureServices(IServiceCollection services) { services.AddMvc(); } public void Configure(IApplicationBuilder app, IHostingEnvironment env) { if (env.IsDevelopmen
-
浅谈ASP.NET Core 2.0 带初始参数的中间件(译)
问题 如何在ASP.NET Core 2.0向中间件传入初始参数? 答案 在一个空项目中,创建一个POCO(Plain Old CLR Object)来保存中间件所需的参数: public class GreetingOptions { public string GreetAt { get; set; } public string GreetTo { get; set; } } 添加一个中间件: public class GreetingMiddleware { private readon