Blazor_WASM的Razor语法，如何改写为长尾？

本文共计842个文字，预计阅读时间需要4分钟。

Blazor WASM 之 2：Razor 语法 + Razor 是一种标记语法，用于将 .NET 代码嵌入网页中。Razor 语法由 Razor 标记和 C# 语法组成。

Blazor_WASM之2：Razor语法

Razor 是一种标记语法，用于将基于 .NET 的代码嵌入网页中。 Razor 语法由 Razor 标记、C# 和 HTML 组成。 Razor 可在 Razor 组件 文件 (.razor) 中找到。 Razor 语法类似于各种 JavaScript 单页应用程序 (SPA) 框架（如 Angular、React、VueJs 和 Svelte）的模板化引擎，本文针对Razor文件介绍Razor常用语法。

Razor 语法参考

Razor语法

@*直接输出变量*@ <p> @Name</p> @*如果就像输出@，则使用另个@*@ <p> @@Name</p> @*如果是明显的邮箱格式则按邮箱格式输出*@ <p>123@Name.com</p> @*虽然是邮箱格式，但是两个@会重新将Name作为属性*@ <p>123@@Name.com</p> @*如果是邮箱格式，但是想输出Name属性可以用括号*@ <p>123@(Name).com</p> @*razor代码块*@ @*代码块内的 C# 代码不会呈现*@ @code { public string Name { set; get; } = "Test"; public class Student { public string Name { set; get; } public string School{ set; get; } } string GenericMethod<T>() { return typeof(T).Name; } public Student stu = new Student() { Name = "Jerry" ,School = "yucai"}; public int value { set; get; } = 3903; }

Razor隐式表达式

@*隐式 Razor 表达式,可以直接使用.*@ @*但是隐式表达式不能使用泛型*@ <p>@stu.Name</p>

Razor显示表达式

@*显式表达式*@ <p>@(stu.Name)显式</p> <p>@(stu.Name + stu.School)显式</p> @*可以调用私有方法*@ <p>@(GenericMethod<int>())泛型</p>

循环

@*for循环*@ @for (int i = 0; i < 3; i++) { <p>第@(i)个</p> <p>@Name</p> }

控制结构

@if (value % 2 == 0) { <p>The value was even.</p> } @*else 和 else if 不需要 @ 符号：*@ @if (value % 2 == 0) { <p>The value was even.</p> } else if (value >= 1337) { <p>The value is large.</p> } else { <p>The value is odd and small.</p> } @switch (value) { case 1: <p>The value is 1!</p> break; case 1337: <p>Your number is 1337!</p> break; default: <p>Your number wasn't 1 or 1337.</p> break; }

using语句块

@*自动释放变量*@ @*@using (FileStream fs = new FileStream(".",FileMode.OpenOrCreate)) { }

异常捕获块

@try { throw new InvalidOperationException("You did something invalid."); } catch (Exception ex) { <p>The exception message: @ex.Message</p> } finally { }

特性

每个Razor会编译成一个类，可以给该类增加一个特性

@attribute [Authorize]

实现接口

@implements IDisposable

继承类

@inherits CustomRazorPage<TModel>

定义为泛型

@typeparam TEntity where TEntity : class

路由

指定 Razor 组件应直接处理请求

@page "/test"

引用命名空间

@using Microsoft.AspNetCore.Authorization

定义命名空间

命名空间首字母必须大写

@namespace Mynamespace

依赖注入

@inject Logger<Test> logger 等价于 private readonly Logger<Test> logger; public Test(Logger<Test> log) { logger = log }