Blazor 中的 @{} @code{} 和 @function{} 有什么区别?

Question

我正在学习服务器端。布拉佐 .

我已经阅读了一些项目的代码，发现一些使用：

@{
}

以及一些使用：

@code{
}

以及其他使用：

@function{
}

以标记代码块。

我想知道它们之间的区别。谢谢。

Answer 1

指令的@

应使用@code{ }[2]。@function{ }[3] 仍然有效，在方法的情况下，不建议在当前版本中使用。

[2] https://learn.microsoft.com/vi-vn/aspnet/core/mvc/views/razor?view=aspnetcore-3.0#code

[3] https://learn.microsoft.com/vi-vn/aspnet/core/mvc/views/razor?view=aspnetcore-3.0#functions

请参阅文档以了解所有情况 https://learn.microsoft.com/vi-vn/aspnet/core/mvc/views/razor?view=aspnetcore-3.0#functions

Answer 2

@{ }

您不能在 @{} 下使用函数或设置 get属性，只能使用 declare。 例如：

@{
DateTime today = DateTime.Now;
}

但是下面的代码会显示错误，因为我在这里使用函数：

@{
public DateTime GetDate()
{
return DateTime.Now;
}
}

@code{ }

可以在{} @code下编写任何C# 代码，例如：

@code{
[Parameter]
public Guid id { get; set; }
AccessoryDto accessory;
protected override Task OnInitializedAsync()
{
if (id == Guid.Empty)
accessory = new AccessoryDto();
else
accessory = GetAccessory(id);
return Task.FromResult(accessory);
}
void cancel()
{
NavigationManager.NavigateTo("/accessories");
}
}

@function{ }

@function做与@code相同的事情，但现在一天，建议使用@code。

除此之外，您还可以使用@ 符号来使用条件、循环等。 例如：

@if (id == null)
{
<h1>Create</h1>
}
else
{
<h1>Edit</h1>
}

和

<tbody>
@foreach (var accessory in Accessories)
{
<tr>
<td>@accessory.Name</td>
<td>@accessory.Description</td>
<td>
<a href='/editaccessory/@accessory.Id'>Edit</a>  |
<a href='/delete/@accessory.Id'>Delete</a>
</td>
</tr>
}
</tbody>

此外，你可以@((表示表达式。 例如：

<a href="@($"employee/{employeeId}")">View</a>

Answer 3

在我想了解@ @(( @{} @： @code{} 之间有什么区别之后。我想分享差异的总结

在 Blazor 中，默认的 Razor 语言是 HTML。以下符号可用于将 C# 代码集成到 Blazor 文件中

@ 隐式剃刀表达式 在 HTML 区域中呈现 C# 代码。

@(( 与 @ 相同，但显式剃刀表达式

@{} 将 C# 代码集成到 HTML 区域中。 此代码的呈现方式与 @(( 中的代码不同。

@：如果您在 @{} 块内插入显式文本，您可以通过添加 @： 符号来执行此操作

@code{} @code块使你能够向 Blazor 页面添加字段、属性和方法

@page "/test"
@s1
@(s1)
<br />
@{
Random r = new Random();
}
@(r.Next())
<br />
@(s2)
@{
@:(s2)
}
@((MarkupString)s2)
@code {
string s1 = "Hello";
string s2 = "<h1>Hello</h1>";
}