ASP.NET Core : 四. _Layout与_ViewStart

简介: 本章我们新建一个项目,并通过这个项目熟悉一下_Layout与_ViewStart以及它们的加载顺序.

本章我们新建一个项目,并通过这个项目熟悉一下_Layout与_ViewStart以及它们的加载顺序.

新建一个项目
首先, 文件->新建一个解决方案

image.png

选择.Net Core 的APP下面的ASP.NET Core Web App(MVC)

Next

image.png

设置解决方案的名称(和Xcode的界面风格有点像), 输入FL.WeightManager, 做一个每天记录体重的应用

点击Create.

项目新建完毕, 项目的文件结构上一章已经说过了.

_layout的应用
新建好的项目默认运行效果如下图

image.png

页面主要分三部分, 上面的header, 下面的footer, 点击上面菜单总的Home、About和Contact切换一下页面看一下

这两部分都是不变的, 只有中间部分在变.

打开Shared文件夹下面的_layout.cshtml页面看一下, header和footer都是定义在这里的,

而中间变的部分是 @RenderBody().也就是我们经常要改变的地方了.

现在将主页改变一下, 打开Home文件夹下的Index文件,将里面的一大堆代码改成如下代码

1 @{
2 ViewData["Title"] = "主页";
3 }
4

序号 日期 体重 备注
1 2018-02-15 66.6 除夕,胖了
2 2018-02-16 68.8 春节,又重了

刷新一下页面

image.png

看起来效果还不错, 可能会注意到, 这个table有个class

这个class定义在哪里呢.

再次打开_layout文件, 可以看到里面在Development环境下引用了bootstrap的css

<environment include="Development">
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="~/css/site.css" />
</environment>

所以可以把一些"通用"的css和js的引用放在layout文件里, 避免重复写这些引用.

顺便把header和footer中显示的项目名称改一下, 然后分别打开Index和About这些页面, Header和Footer都统一改变了.

如下图的About页面.

image.png

但是我们在这个Index页中没有对这个模板做引用, 是通过什么方式引用的呢?

_ViewStart的应用
回顾修改后的Index页面, 我们并没有写 Layout = "_Layout" 这样的代码, 这是因为已经在_ViewStart中默认设置了

_ViewStart中只有这一句

@{

Layout = "_Layout";

}

如果我们在Index页面中添加一句 Layout=null 如下,

@{

Layout=null;
ViewData["Title"] = "主页";

}

再次刷新页面, 样子变成了这样

Header和Footer以及Table的样式全都没有了, 是因为这些本来都写在_Layout中, 现在失去了对_Layout的引用, 这些也就消失了.

总结: _ViewStart对模板页做了默认的设置, 除非显示的写明Layout=XXX, 否则会采用_ViewStart中的设置.

   所以未做设置和设置 Layout = "_Layout" 的效果是一样的.

_ViewStart、_Layout和Index(实际页面)的加载顺序
加载顺序是: _ViewStart =>Index=>_Layout.

1._ViewStart在所有View加载之前加载, 设置了默认的模板页.

2.接着由Controller指定的页面查找Index.cshtml加载, 并读取该页面的Layout设置.

3.根据Index页面的Layout设置的模板页查找对应的模板页加载.

将_ViewStart中的 Layout = "_Layout" 改为 Layout = "_Layout1" , 再次运行, 页面会出现如下找不到模板的错误.

An unhandled exception occurred while processing the request.

InvalidOperationException: The layout view '_Layout1' could not be located. The following locations were searched:
/Views/Home/_Layout1.cshtml
/Views/Shared/_Layout1.cshtml
Microsoft.AspNetCore.Mvc.Razor.RazorView.GetLayoutPage(ViewContext context, string executingFilePath, string layoutPath)

目录
相关文章
|
6天前
|
开发框架 .NET 开发者
简化 ASP.NET Core 依赖注入(DI)注册-Scrutor
Scrutor 是一个简化 ASP.NET Core 应用程序中依赖注入(DI)注册过程的开源库,支持自动扫描和注册服务。通过简单的配置,开发者可以轻松地从指定程序集中筛选、注册服务,并设置其生命周期,同时支持服务装饰等高级功能。适用于大型项目,提高代码的可维护性和简洁性。仓库地址:&lt;https://github.com/khellang/Scrutor&gt;
24 5
|
24天前
|
开发框架 .NET C#
在 ASP.NET Core 中创建 gRPC 客户端和服务器
本文介绍了如何使用 gRPC 框架搭建一个简单的“Hello World”示例。首先创建了一个名为 GrpcDemo 的解决方案,其中包含一个 gRPC 服务端项目 GrpcServer 和一个客户端项目 GrpcClient。服务端通过定义 `greeter.proto` 文件中的服务和消息类型,实现了一个简单的问候服务 `GreeterService`。客户端则通过 gRPC 客户端库连接到服务端并调用其 `SayHello` 方法,展示了 gRPC 在 C# 中的基本使用方法。
35 5
在 ASP.NET Core 中创建 gRPC 客户端和服务器
|
14天前
|
开发框架 缓存 .NET
GraphQL 与 ASP.NET Core 集成:从入门到精通
本文详细介绍了如何在ASP.NET Core中集成GraphQL,包括安装必要的NuGet包、创建GraphQL Schema、配置GraphQL服务等步骤。同时,文章还探讨了常见问题及其解决方法,如处理复杂查询、错误处理、性能优化和实现认证授权等,旨在帮助开发者构建灵活且高效的API。
23 3
|
2月前
|
开发框架 JavaScript 前端开发
一个适用于 ASP.NET Core 的轻量级插件框架
一个适用于 ASP.NET Core 的轻量级插件框架
|
开发框架 前端开发 .NET
ASP.NET Core 核心特性学习笔记「下」
ASP.NET Core 核心特性学习笔记「下」
|
开发框架 前端开发 中间件
ASP.NET Core 核心特性学习笔记「上」
ASP.NET Core 核心特性学习笔记「上」
|
SQL 机器学习/深度学习 Cloud Native
.NET 云原生架构师训练营(模块二 基础巩固 EF Core 更新和迁移)--学习笔记
- 状态 - 自动变更检测 - 不查询删除和更新 - 并发
253 0
.NET 云原生架构师训练营(模块二 基础巩固 EF Core 更新和迁移)--学习笔记
|
SQL Cloud Native 架构师
.NET 云原生架构师训练营(模块二 基础巩固 EF Core 查询)--学习笔记
- 关联数据加载 - 客户端与服务端运算 - 跟踪与不跟踪 - 复杂查询运算 - 原生 SQL 查询 - 全局查询筛选器
246 0
.NET 云原生架构师训练营(模块二 基础巩固 EF Core 查询)--学习笔记
|
Cloud Native 架构师
|
存储 开发框架 Cloud Native
.NET 云原生架构师训练营(模块二 基础巩固 EF Core 基础与配置)--学习笔记
- 连接字符串 - 异步编程 - 日志 - DbContext池 - 类和配置表 - 属性和列配置 - 并发token - 索引
309 0
.NET 云原生架构师训练营(模块二 基础巩固 EF Core 基础与配置)--学习笔记