为什么我的 blazor.server.js 之后无法加载任何 js？

Question

所以我注意到在我的 _Host.cshtml 文件中，我在</body>标签之前有这个脚本

 <script src="_framework/blazor.server.js"></script>

我还有一些应该在之后加载的脚本，它们是

    <script src="assets/plugins/jquery/jquery.min.js"></script>
    <script src="assets/plugins/jquery-ui/jquery-ui.js"></script>
    <script src="assets/plugins/popper/popper.js"></script>
    <script src="assets/plugins/feather/feather.min.js"></script>

    <script src="assets/plugins/bootstrap/js/bootstrap.min.js"></script>
    <script src="assets/plugins/typeahead/typeahead.js"></script>
    <script src="assets/plugins/typeahead/typeahead-active.js"></script>
    <script src="assets/plugins/pace/pace.min.js"></script>
    <script src="assets/plugins/slimscroll/jquery.slimscroll.min.js"></script>
    <script src="assets/plugins/highlight/highlight.min.js"></script>

    <!-- Articles Script -->
    <script src="assets/plugins/dataTable/datatables.min.js"></script>
        <script src="assets/plugins/summernote/summernote.min.js"></script>
        <script src="assets/plugins/bootstrap-tagsinput/bootstrap-tagsinput.js"></script>
    <!-- Required Script -->
    <script src="assets/js/app.js"></script>
    <script src="assets/js/avesta.js"></script>
    <script src="assets/js/avesta-customizer.js"></script>

</body>

但是，如果我的顶部有 blazor.js 脚本，我的菜单将无法正常工作，它将停止工作并如下所示。实际上，我点击了很多次，但它并没有像你所看到的那样有动画效果。

但是，如果我将 blazor.server.js 脚本放在底部最后加载，它就可以正常工作，看起来像这样

但是如果我最后加载它，我会在控制台中看到它

这导致我无法做到这一点

<input @bind="@CurrentValue" @oninput="@((e) => { CurrentValue=(string)e.Value;})" @onkeypress="KeyPress" class="form-control" type="text" placeholder="Search" aria-label="Search">

它只是根本没有击中该函数，什么也没有发生，它没有注册它。

Answer 1

使用 Net5，您现在可以通过覆盖OnAfterRenderAsync. 这是一个例子

你首先会继承IJSRuntime

@inject IJSRuntime JSRuntime 

然后是代码：

@code {        
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if(firstRender)
        {
            await JSRuntime.InvokeAsync<IJSObjectReference>("import", "/assets/plugins/jquery/jquery.min.js");
        }
    }
}