WebPages Razor学习笔记
什么是Razor?
Razor是用于在.NET Web应用程序中创建动态Web页面的一种视图引擎。它可以作为ASP.NET Web Pages, ASP.NET MVC和ASP.NET Core的视图引擎。
Razor视图引擎使用一种混合语法,将C#代码与HTML标记结合在一起,从而使页面更加动态且易于维护。
Razor基础语法
Razor注释
使用@符号加上单行注释符号"//"可以在Razor页面中添加单行注释:
htmlCopy Code@// This is a single-line comment
对于多行注释,可以使用@和@符号:
htmlCopy Code@* This is a multi-line comment *@
Razor变量
在Razor中,可以通过@符号将C#变量插入到HTML标记中。例如:
htmlCopy Code<p>Current date: @DateTime.Now</p>
Razor控制结构
if/else
可以使用@if,@else和@else if语句来创建条件逻辑块:
htmlCopy Code@if (condition) {
<p>This will show if the condition is true</p>
}
else if (anotherCondition) {
<p>This will show if the anotherCondition is true</p>
}
else {
<p>This will show if neither is true</p>
}
循环
使用@for或@foreach语句可以创建循环结构:
htmlCopy Code@for (int i = 0; i < 10; i++) {
<p>The current value of i is @i</p>
}
@foreach (var item in collection) {
<p>The current item is @item</p>
}
Razor部分视图
使用@{...}可以在Razor页面中定义代码块,这可以用于在页面中嵌入C#代码。
此外,还可以使用@RenderSection方法来呈现其他部分视图:
htmlCopy Code<!-- _Layout.cshtml -->
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
</head>
<body>
<div id="content">
@RenderBody()
</div>
<div id="sidebar">
@RenderSection("sidebar", required: false)
</div>
</body>
</html>
htmlCopy Code<!-- MyPage.cshtml -->
@{
ViewBag.Title = "My Page";
}
@section sidebar {
<p>This is the sidebar content for MyPage</p>
}
<p>This is the body content for MyPage</p>
实例
假设我们正在开发一个电子商务网站,我们有一个产品列表页面,要在该页面上显示一些产品。产品信息存储在数据库中,并且我们需要通过调用代码来检索它们。
我们可以创建一个名为_Products.cshtml的部分视图,用于呈现产品列表:
htmlCopy Code@model IEnumerable<Product>
<table>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
</tr>
@foreach (var product in Model) {
<tr>
<td>@product.Name</td>
<td>@product.Description</td>
<td>@product.Price</td>
</tr>
}
</table>
然后,在我们的列表页面中,我们可以使用@Html.Partial方法来呈现产品列表部分视图:
htmlCopy Code@{
ViewBag.Title = "Product List";
var products = GetProductsFromDatabase();
}
<h1>Product List</h1>
@Html.Partial("_Products", products)
这将呈现_Products部分视图,并传递从数据库中检索到的产品列表作为模型。