在Blazor中，如何从静态C#方法中调用JS函数

Question

在一个剃刀文件中，我注入@inject IJSRuntime JSRuntime。在后面的代码中，我用以下代码调用JS函数：

private async Task DownloadPdf(bool foo)
{
await using var module = await JSRuntime.InvokeAsync<IJSObjectReference>("import", "./create-pdf.js");
await module.InvokeVoidAsync("generatePdf", foo);
}

这很好，但现在我需要从C#代码中调用一个JS函数，该函数不是代码隐藏的，而是一个单独的*.cs文件：

public static class Bar
{
public static double Baz()
{
// do something
// call JS function
return baz;
}
}

我尝试过这种方法，但JSRuntime始终是null。如何从静态C#方法调用JS？

Answer 1

• 假设Baz始终是static方法，则需要将IJSRuntime对象传递到Bar.Baz中。
  • 不要试图通过class Bar上的static字段或属性传递IJSRuntime：这将破坏您的应用程序，因为static数据由所有线程共享
• 此外，看起来IJSRuntime.InvokeAsync是一个返回async的Task方法，您需要使Bar.Baz也同样异步

如此：

public static class Bar
{
public static async Task<Double> BazAsync( IJSRuntime js, CancellationToken cancellationToken = default )
{
if( js is null ) throw new ArgumentNullException(nameof(js));
// do something
// call JS function:
_ = await js.InvokeAsync<TReturnValue>( identifier: "someFunction", cancellationToken, args: new Object[] { "abc", 123 } );

// return
Double baz = 123.45d;
return baz;
}
}

然后你可以在类后面用Blazor代码调用它，比如：

public partial class MyCodeBehindClass
{
[Inject]
IJSRuntime JSRuntime { get; set; }
private async Task DoSomethingAsync()
{
Double baz = await Bar.BazAsync( this.JSRuntime );
}
}