0
点赞
收藏
分享

微信扫一扫

Blazor_WASM之2:Razor语法

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;

}

image-20230306161504614

Razor隐式表达式

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

image-20230306161615290

Razor显示表达式

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

image-20230306161651538

循环

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

image-20230306161803922

控制结构

@if (value % 2 == 0)
{
<p>The value was even.</p>
}
@*elseelse 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;
}

image-20230306161901599

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
}
举报

相关推荐

0 条评论