Blazor -移植管理模板

Question

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

所有的CSS都很好，我现在唯一的问题是Admin模板使用jQuery来进行大量的CSS操作和漂亮的样式操作。

起初，我不想使用jQuery，因为当您认为使用Blazor就像试图摆脱Javascript一样，但是因为在这个Admin模板中有一些不错的左菜单动画和悬停CSS样式的控制，还有很多其他的事情，我想更容易的方法是添加jQuery。

模板使用一个以以下开头的app.js文件：

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

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

我读到了这样的信息，为了用Blazor来使用jQuery，您需要让Blazor控制DOM，所以我的jQueryapp.js文件中不会有一个onReady或Load事件。我需要从Blazor调用一个初始化器方法，该方法将充当Load事件。

我的问题是：

1. ，我必须在Blazor中使用的生命周期方法是什么？由于Blazor是一个OnAfterRenderAsync(bool firstRender).

SPA，所以组件的初始设置只需要调用一次，或者在刷新页面时调用，是使用OnInitialized还是使用OnInitialized

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

在Blazor中使用

1. 使用jQuery是违背其概念设计的，还是没有问题或使用它的坏模式？我不打算使用ajax之类的东西，等等基本上就是用jQuery.

很容易完成的DOM操作。

Answer 1

您应该使用OnAfterRenderAsync(bool firstRender)方法来初始化JavaScript对象，并且只需初始化一次；也就是说，您的代码应该包装在if语句中，如下所示：

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

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

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

在Blazor中使用

是违背其概念设计的，还是没有问题或使用它的坏模式？

在Blazor中寻找最佳做法的过程正在进行中。就我个人而言，我反对在Blazor中使用jQuery，我会使用JSInterop将jQuery小部件转换为Blazor组件。但只有我一个人。另一些人则不这么认为，或者至少不这么认为。

但是，在您的示例中，最好的方法是检查给定的jQuery代码是否与Blazor呈现系统无缝地工作。也许，如果它只是“菜单动画和悬停CSS样式的控制”，没有问题是真正需要引起的。但你永远不可能知道。因此，正如我前面所说的，您应该这样做，并测试它是否有效，没有任何问题。