adminLTE 2.4.5树视图在刷新后无法正常工作，只有它在rails中工作

Posted 2023-02-25

版本列表： - * rails 5.2.2 * sass-listen（4.0.0）* sass-rails（5.0.7）* sprockets（3.7.2）* sprockets-rails（3.2.1）* turbolinks（5.2.0） * turbolinks-source（5.2.0）

我在rails 5.2.2版本中使用adminLTE 2.4.5版本。我正在加载的所有文件，来自vendor文件夹的所有adminLTE资源，所有UI都正常工作，但多级菜单的树视图无法正常工作。

案例1：它是第一次工作或我手动刷新网页时。

案例2：当它工作时，如果我点击菜单项的链接，链接将重定向到特定页面，但在此之后树视图不起作用，它甚至不会崩溃。

以下是我的代码：

<aside class="main-sidebar">
  <section class="sidebar">
    <ul class="sidebar-menu tree" data-widget="tree">
      <li class="treeview">
        <a href="#"><i class="fa fa-wrench"></i> <span>Reminders</span>
           <span class="pull-right-container">
             <i class="fa fa-angle-left pull-right"></i>
           </span>
        </a>
        <ul class="treeview-menu">
          <li>
            <%=link_to "Service Reminders",service_reminders_path%>
          </li>
          <li><a href="#">Vehicle Renewals</a></li>
        </ul>
      </li>
   </ul>
 </section>
</aside>

工作菜单截图：

单击服务提醒链接后，它会重定向到特定页面，然后树视图停止工作

答案

我遇到了同样的问题，turbolinks与treemenu所需的javascript钩子不兼容。

要禁用turbolinks：

从app / assets / javascript / application.js删除，

//= require turbolinks

从app / views / layouts / application.html.erb中删除以下turbolinks引用，

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

看起来像，

<%= stylesheet_link_tag    'application', media: 'all' %>
<%= javascript_include_tag 'application' %>

您还可以从Gemfile列表中删除turbolinks gem。

然后，您应该发现树状菜单按预期工作。

另一答案

• 不要禁用turbolinks，因为它加快了rails应用程序中页面之间的导航速度，而不是禁用你可以让它在之前工作，我将解释它为什么不起作用。
• 当使用Jquery时，$（function（）...）简写绑定到文档就绪事件并且它是常用的。
• 不幸的是，这具有默认配置，它不适用于turbolinks。
• 更糟糕的是，它将适用于整页加载，但$（function（）...）中的js代码将不会在后续turbolinks驱动的导航上运行，因为turbolinks不会触发文档就绪事件。
• 我通过添加adminlte js文件解决了这个问题。 $(document).on('turbolinks:load',function()...)

以下是我在adminlte js文件Tree函数中替换代码的代码。

$(document).on('turbolinks:load', function()
  $(Selector.data).each(function () 
    Plugin.call($(this));
  );
);

另一答案

在布局文件中尝试这个：

= javascript_include_tag 'application', 'data-turbolinks-track': 'reload'