如何在页面加载时加载Blazor上的JavaScript和jQuery UI

Question

我有一个管理模板，我想使用Blazor。我已经把所有的JavaScript和jQuery UI和CSS放在了_host.chtml文件上。然后，我将模板分割成导航、页眉和页脚等布局。

加载仪表板页面后，所有的bootstrap js功能，如可折叠菜单，关闭按钮对话框，都不起作用。

但是，当我尝试单击页面中的href链接，然后单击back按钮时，JavaScript功能正常工作。

如果你有一堆与jQuery捆绑在一起的CSS用户界面和引导JavaScript，那么它就不会工作。

Answer 1

您可以通过注入IUriHelper来订阅更改的URL，然后调用一些JS来添加钩子。

然而，事情不会那么简单。当Blazor组件呈现时，它们可以选择创建HTML元素，例如在集合上执行foreach以呈现数据时。有很多场景可以在没有导航的情况下触发重新渲染(例如单击按钮)。

您需要使用@onmouseenter、@onnouseout等事件来显式地装饰您的组件，而不是使用单个函数，它们将所有内容连接在一起。

Answer 2

我所做的就是使用javascript interop在组件加载时调用theme.js。我有这个

    reloadPage: function () {
            $.getScript('assets/javascripts/theme.js');
            $.getScript('assets/javascripts/theme.custom.js');
            $.getScript('assets/javascripts/theme.init.js');
        }

然后我删除了assets/javascript/teme.js的引用。等在主_host.chtml上。

它成功了！哈哈