从JS代码到静态Blazor方法使用注入服务

Question

我有一个应用程序，它使用jQuery库来显示“确认”对话框。

当用户在对话框上单击“OK”或“Cancel”时，首先对我的Javascript代码进行回调。从那里开始，我根据用户所做的决定调用了一个Blazor方法。

这一切看起来都是这样的：

我的js密码：

$('.alert-yesno).on('click', function() {
    // For simplicity I immediately call the Blazor method
    DotNet.invokeMethodAsync('[Assembly name]', 'DoSomething')
                            .then(data => {
                                // do something...
                            });
});

Blazor页面：

@inject MyService MyService

<button class="alert-yesno">Show dialog</button>

@code
{
    [JSInvokable]
    public static async Task DoSomething()
    {
        // How to use the non static MyService here...?
    }
}

一切都很好。Javascript部分调用我的Blazor方法。但是如何从那里使用MyService呢？这将被注入到页面中。这很好，因为它利用了依赖注入。

我不想每次都在static方法中创建一个static实例，因为这样我就会释放所有的自动注入依赖项。

我怎样才能解决这个问题？

Answer 1

有关更完整的示例，请参见https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interop?view=aspnetcore-3.0#instance-method-call，但您可以通过调用

DotNetObjectReference.Create(myInstance);

然后javascript代码可以调用该对象上的实例方法。由于组件(以及注入到组件中的服务)与jquery单击处理程序具有不同的生命周期，这可能会导致其他一些问题，但上面的链接应该是一个很好的起点。