Blazor 中的@{} @code{} 和 @function{} 有什么区别？答案

【问题标题】：What is the difference between @{} @code{} and @function{} in Blazor?Blazor 中的@{} @code{} 和 @function{} 有什么区别？
【发布时间】：2020-02-05 06:58:05
【问题描述】：

我正在学习服务器端。布雷泽。

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

@{
}

还有一些使用：

@code{
}

以及其他使用：

@function{
}

标记代码块。

我想知道这些之间的区别。谢谢。

【问题讨论】：

我认为这个链接有你需要的一切：docs.microsoft.com/pt-br/aspnet/core/mvc/views/…
@DiógenesFrança 非常感谢。这就是我需要的。
@code 用于剃须刀组件。但我仍然很困惑。我可以在@{} 中声明一个函数，以为我不能声明一个属性？

标签： asp.net-core .net-core blazor

【解决方案1】：

@ 用于指令

@code{ } [2] 应该被使用。 @function{ }[3]仍然有效，如果是方法，当前版本不推荐使用。

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

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

查看所有案例的文档https://docs.microsoft.com/vi-vn/aspnet/core/mvc/views/razor?view=aspnetcore-3.0#functions

【讨论】：

【解决方案2】：

@{ }

不能使用@{}下的function或set get属性，只能使用declare。例如：

@{
    DateTime today = DateTime.Now;
}

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

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

@代码{ }

您可以在 @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 与 @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>

【讨论】：

【解决方案3】：

在我想了解 @@() @{} @: @code{} 之间的区别之后。我想分享差异的摘要

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

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

@() 与 @ 相同，但显式 Razor 表达式

@{} 将 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>";
}

【讨论】：