c# - Blazor onended 不开火

Question

我开始使用 Blazor。我的目的是一个接一个地播放随机视频。因此我想使用 Blazor 事件监听器。但是 onended 事件没有触发(onclick 一切正常)。
视频元素:

<figure id="video-player">
    <video autoplay="autoplay" @onended="NewVideo">
        @videoUrl
    </video>
</figure>

代码块:

private MarkupString videoUrl;

    protected override void OnInitialized()
    {
        NewVideo();
    }

    private void NewVideo()
    {
        videoUrl = new MarkupString($"<source src=\"videos/{tv.GetRandomVideoFileName()}\" type=\"video/mp4\">");

    }

OnInitialized 按预期工作，如果我将 onended 更改为 onclick，一切也正常。
提一下:我知道，仅更改源不会启动下一个视频。那将是我在列表中的下一个任务:)。首先，我只想更改 DOM 中的源。

Answer 1

简短的故事是这不受支持，并且没有发布 v5 版本。请参阅此处的问题:
https://github.com/dotnet/aspnetcore/issues/24323
更长的故事是你必须启动一些 JS 互操作。引用在这里:
https://docs.microsoft.com/en-us/aspnet/core/blazor/call-dotnet-from-javascript?view=aspnetcore-5.0#component-instance-method-call
在 JS 方面，你需要这样的东西:

var player = document.getElementById('player');
player.onended = (e) => {
    DotNet.invokeMethodAsync('{assembly_name_here}', 'SongEnded');
};

程序集名称可能是项目的名称，例如 MyBlazorApp .然后在你的组件中，你需要一个静态 Action 来连接它:

    protected override void OnInitialized()
    {
        action = UpdateMessage;
    }
    private static Action action;

    private void UpdateMessage()
    {
        // DO STUFF HERE
    }

    [JSInvokable]
    public static void SongEnded()
    {
        action.Invoke();
    }

这确实有点笨拙，但本质上是将 JS 事件映射到组件上的静态方法。您可能会想，“好吧，如果我有多个组件实例怎么办？”在这种情况下，您必须在将上下文传递给静态方法并找到正确的实例方面有点创意。再次检查上面的引用资料，它有很多例子。