在 ASP.NET MVC 中,.cshtml
是 Razor 视图文件的扩展名,用于定义应用程序的用户界面(UI)。它是一种混合了 HTML、C# 代码和 Razor 语法的模板文件,负责将数据呈现为最终用户可见的网页。
核心特点:
-
混合语法支持
.cshtml
文件中可以同时包含:- HTML 标记:用于定义页面的结构和外观(如
<div>
、`` 等)。 - C# 代码:通过 Razor 语法(以
@
符号开头)嵌入,用于处理逻辑、动态生成内容或访问数据。 - Razor 指令:如
@model
(指定视图模型类型)、@using
(引入命名空间)等。
示例:
@model ServiceDto <!-- 指定视图模型类型 --> <h1>@Model.name 的状态 <!-- 嵌入 C# 代码获取模型数据 --> <p>IP: @Model.ip</p> @if (Model.lastChecks.Any(s => s.status == "down")) <!-- 条件逻辑 --> { <span class="text-red-500">服务异常</span> }
- HTML 标记:用于定义页面的结构和外观(如
-
与 MVC 架构的关系
在 MVC(Model-View-Controller)模式中,.cshtml
文件属于 View(视图) 层,主要职责是:- 接收 Controller(控制器)传递的 Model(模型)数据。
- 将数据格式化并渲染为 HTML 输出给浏览器。
- 不处理业务逻辑,仅负责数据展示(遵循“关注点分离”原则)。
-
强类型支持
通过@model
指令可以指定视图模型类型,实现强类型视图,获得编译时类型检查和 IntelliSense 提示,减少运行时错误:@model List<ServiceDto> <!-- 强类型为 ServiceDto 列表 --> @foreach (var service in Model) <!-- 遍历模型数据 --> { <div>@service.name</div> }
-
布局与复用
支持通过 布局页(Layout)、部分视图(Partial View) 和 模板(Template) 实现 UI 复用:- 布局页(如
_Layout.cshtml
)定义网站共用结构(页眉、页脚、导航),其他视图通过@Layout
引用。 - 部分视图(如
_ServiceStatus.cshtml
)用于复用小片段 UI(如服务状态卡片),通过@Html.Partial()
引入。
- 布局页(如
-
编译与执行
首次请求时,.cshtml
文件会被编译为 .NET 类(继承自WebViewPage
),之后直接执行编译后的代码,提升性能。
简单来说,.cshtml
是 ASP.NET MVC 中连接后端数据与前端展示的“桥梁”,通过 Razor 语法的灵活性,让开发者能够高效地创建动态、交互式的网页。