小编gen*_*xhd的帖子

通过“交互式服务器渲染模式”和“流式渲染”的组合来防止双重渲染

我正在探索 .NET 8 的新 Blazor 功能,但遇到了一个问题:我的组件似乎渲染了两次。当我将“流渲染”与“交互式服务器渲染模式”结合使用时,会出现此问题。

为了清楚起见,我简化了我的代码:

@attribute [StreamRendering]
@rendermode InteractiveServer

@if (data == null)
{
    <p>Loading...</p>
}
else
{
    <p>@data</p>
}

@code {
   private string? data;

    protected override async Task OnInitializedAsync()
    {
        await Task.Delay(1000);
        data = "Hello World!";
    }
}
Run Code Online (Sandbox Code Playgroud)

在此代码中,我希望首先显示“Loading...”文本,然后在延迟后显示文本“Hello World!” 应该更换它。这是可行的,但是一旦data显示,组件就会重新渲染并且加载文本会再次显示。

我的问题是:

  • 我是对的,第二次重新渲染是因为建立了与服务器的电路连接而发生的?
  • 有没有办法防止第二次重新渲染?

.net asp.net-core blazor blazor-server-side

3
推荐指数
1
解决办法
1276
查看次数

标签 统计

.net ×1

asp.net-core ×1

blazor ×1

blazor-server-side ×1