时间戳

首页 > 解决方案 > 如何在 Blazor 服务器端更新多个用户？

signalr - 如何在 Blazor 服务器端更新多个用户？

问题描述

假设我想要一个用户界面，其中组中的用户具有同步视图。想象一个群聊应用程序，群中的每个人都应该看到完全相同的消息。

当用户向群组发布消息时，整个群组都需要接收它。

使用 JS，我可能会使用 SignalR 组，并让前端生成一个 SignalR 事件并发布一条消息。然后，服务器端集线器将该消息发送到该组。

在服务器端 Blazor 上，由于所有用户的状态都已经在服务器上，我将如何协调更新 Blazor 上用户组的 UI？

标签： signalrblazorblazor-server-side

解决方案

我试图实现类似的目标。一段时间后，我发现了一种方法。凯尔的回答帮助我弄清楚了。

您必须创建一个类，让我们调用Messenger，它有一个 Action 属性，以及一个调用此 Action 的方法

public Action OnMessage { get; set; }
public void AddMessage(string message)
{
  Text = message;
  OnMessage?.Invoke();
}

在 razor 组件中，注入 Messenger。此外，您应该为 OnMessage 属性设置一个事件，然后调用 StateHasChanged 以告诉视图它可以更新

@inject Messenger messenger
// rest of component here, and then the code block 
protected override async Task OnInitializedAsync()
{
  messenger.OnMessage += () =>
  {
    // do something with the messenger.Text here
    InvokeAsync(this.StateHasChanged);
  };
}

不要忘记，在您的 Startup 类中，将 Messenger 类添加为 Singleton 以使其可用于注入

services.AddSingleton<Messenger>();

我希望这就是你想要实现的目标，它也可以帮助其他人。干杯。

推荐阅读