Blazor - 移植管理模板

Blazor - Porting a Admin Template

我有一个 HTML Admin template 需要移植 Blazor

所有 CSS 工作正常,我现在唯一的问题是 Admin 模板使用 jQuery 做很多 CSS 操作和漂亮的风格。

起初我不想使用 jQuery 因为当你认为使用 Blazor 就像试图摆脱 Javascript 时,但是因为在这个 Admin 模板中有一些不错的左侧菜单悬停 CSS 样式的动画和控制以及许多其他我想最简单的方法是添加 jQuery.

该模板使用 app.js 文件,其开头为:

  $(window).on('load', function () {
  .....
  }

在加载事件中设置了很多东西。

我读到要使用 Blazor jQuery,您需要让 Blazor 控制 DOM,所以我的 jquery app.js 文件中不会有onReadyLoad 事件。我将需要从 Blazor 调用一个 Initializer 方法,该方法将充当 Load 事件。

我的问题是:

  1. 为了 运行 我必须在 Blazor 中使用什么生命周期方法?因为 Blazor 是一个 SPA 组件的初始设置将只调用一次或在刷新页面时调用,我应该使用 OnInitialized 还是 OnAfterRenderAsync(bool firstRender).

  2. 将 运行 此初始设置的 Blazor 生命周期方法必须 运行 在主路由路径上 @page "/"?

  3. 在 Blazor 中使用 jQuery 是违反其概念设计还是没有问题或使用它的错误模式?我不会使用任何 ajax 东西,等等基本上只是 DOM 操作,用 jQuery.

    很容易做到

您应该使用 OnAfterRenderAsync(bool firstRender) 方法来初始化您的 JavaScript 对象,并且只能使用一次;也就是说,您的代码应该像这样包含在 if 语句中:

if( firstRender )
{
// Initialization code comes here...
}

The Blazor life cycle method that will run this initial setup has to run on the main routing path @page "/"?

不一定...它应该运行在您要使用它的组件页面的路由路径上。

Using jQuery in Blazor is against its conceptual design or there is no problem or bad pattern to use it?

在 Blazor 中寻找最佳实践的过程正在进行中。就个人而言,我反对在 Blazor 中使用 jQuery,我会使用 JSInterop 将 jQuery 小部件转换为 Blazor 组件。但这只是我。其他人,不这么想,或者至少不这样做。

但是,对于您的情况,最好的办法是检查给定的 jQuery 代码是否可以与 Blazor 渲染系统无缝协作。也许如果它只是“菜单动画和悬停 CSS 样式的控制”,那么实际上不会引起任何问题。但你永远无法知道。所以正如我上面所说,你应该这样做,并测试它是否可以正常工作。