如何在Blazor的代码后端(.razor.cs文件)中进行注入？以IJSRuntime为例。

Question

在 Blazor 中使用常规的单页 Razor 组件，可以在页面顶部像这样注入 IJSRuntime：

@inject IJSRuntime JSRuntime

如果我为组件创建了一个 .razor.cs 文件作为代码后端，我该如何在其中注入 IJSRuntime 之类的内容？

- Kyle

Answer 1

在razor.cs文件的代码后台中，可以使用[Inject]属性注入IJSRunTime或其他内容。

public partial class BillingDashboard
{
    [Inject]
    IJSRuntime JSRuntime { get; set; }

    protected override async Task MyFunction()
    {
         await JSRuntime.InvokeVoidAsync("console.log('test')");
    }
}

- Kyle

---

这种方法可能会失败，因为它位于错误的位置。请将其移动到 OnAfterRenderAsync 方法中，并以 "namespace.methodname" 的形式提供参数。不要生气！在你更新答案后我会删除这条评论... - enet

在OnInitializedAsync中调用JavaScript有其合理的使用情况，比如如果你只希望JS在第一次运行而不是在每次重渲染时运行，并且没有访问组件中的DOM元素，那么这种情况也与如何在razor组件代码后台文件中注入内容的问题不是特别相关。 - Kyle

我只是想确保您的代码无论展示什么，都要编写得很好，而不是为了进入任何争论。然而，在预渲染时JavaScript不可用，一些子组件尚未创建等等，并且 OnAfterRenderAsync 是初始化（仅一次）JavaScript对象和应用新设置等（多次发生）最合适的位置。这正是为什么最近在 OnAfterRenderAsync 中引入了名为 firstRender 的布尔参数的原因。 - enet

不要忘记使用Microsoft.AspNetCore.Components;！ - Joshua Schlichting

@PaulCarlton 更简洁的代码是我所知道的唯一优点。 - Kyle