在Blazor服务器_Host.cshtml中运行Javascript

在Blazor服务器_Host.cshtml中运行Javascript,javascript,blazor,blazor-server-side,Javascript,Blazor,Blazor Server Side,我试图在页面加载完成后运行一个简单的javascript函数。基本上,代码所做的是获取当前的基本路径名,找到具有相同id的navlink并在其上粘贴一个类。Blazor的对我来说定制不够,我宁愿这样做。代码可以工作,但它只出现了几分之一秒,然后在console中出现以下内容的同时消失: [2020-08-20T07:43:50.935Z]信息:连接到的WebSocketwss://localhost:44346/_blazor?id=IhkBuLdowknNbyGtvWjcVA. 这是my_Ho

我试图在页面加载完成后运行一个简单的javascript函数。基本上,代码所做的是获取当前的基本路径名,找到具有相同id的navlink并在其上粘贴一个类。Blazor的
对我来说定制不够,我宁愿这样做。代码可以工作,但它只出现了几分之一秒,然后在console中出现以下内容的同时消失:

[2020-08-20T07:43:50.935Z]信息:连接到的WebSocketwss://localhost:44346/_blazor?id=IhkBuLdowknNbyGtvWjcVA.

这是my_Host.cshtml页面:



这是一个由两部分组成的答案——第一部分回答你的问题,第二部分向你展示我希望的更好的方式

  • 你的问题
  • Blazor在内部跟踪UI—就像影子dom一样,但实际上不是一个—并且它无法跟踪您在JS中所做的更改

    当它呈现Nav时,它不知道您添加了那个css类,因此它被Blazor知道的css类列表替换

  • 导航链接
  • NavLink组件有一个属性调用ActiveClass——您可以设置它,当页面处于活动状态时,它将使用您自己的类名

    <NavLink class="nav-link" href="counter" ActiveClass="onpage">
    

    这是一个由两部分组成的答案-第一部分回答您的问题,第二部分向您展示我希望的更好的方式

  • 你的问题
  • Blazor在内部跟踪UI—就像影子dom一样,但实际上不是一个—并且它无法跟踪您在JS中所做的更改

    当它呈现Nav时,它不知道您添加了那个css类,因此它被Blazor知道的css类列表替换

  • 导航链接
  • NavLink组件有一个属性调用ActiveClass——您可以设置它,当页面处于活动状态时,它将使用您自己的类名

    <NavLink class="nav-link" href="counter" ActiveClass="onpage">
    
    
    
    谢谢你的回答!澄清一下,没有办法用javascript更改ui元素?有没有办法让Blazor知道你改变了什么?因为对于一些图标包,您必须运行一些javascript,例如
    feather.replace()
    ,以便实际加载图标。这是一个完全其他的问题,值得拥有自己的空间,但简短的回答是-您可以但非常小心-您不应该更改Blazor有标记的内容,并且将覆盖这些内容。举个简单的例子-如果你呈现一些静态的东西,比如Blazor没有理由更新的图标,因为标记永远不会改变,那么你很可能可以在创建后修改它。谢谢你的回答!澄清一下,没有办法用javascript更改ui元素?有没有办法让Blazor知道你改变了什么?因为对于一些图标包,您必须运行一些javascript,例如
    feather.replace()
    ,以便实际加载图标。这是一个完全其他的问题,值得拥有自己的空间,但简短的回答是-您可以但非常小心-您不应该更改Blazor有标记的内容,并且将覆盖这些内容。举个简单的例子——如果您呈现一些静态的东西,比如Blazor没有理由更新的图标,因为标记永远不会更改,那么您可能可以在创建它之后修改它。