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

Question

版本列表：- * rails 5.2.2 * sass-听 (4.0.0) * sass-rails (5.0.7) * 链轮 (3.7.2) * 链轮-rails (3.2.1) * turbolinks (5.2.0) * turbolinks-source (5.2.0)

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

情况一：第一次或手动刷新网页时正常

情况 2：当它工作时，如果我单击菜单项的 link，link 将重定向到特定页面，但在那之后树视图再次不起作用，它甚至不崩溃。

下面是我的代码：

<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>

工作菜单截图：

点击服务提醒后 link 它重定向到特定页面然后树视图停止工作

Answer 1

在布局文件中试试这个：

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

Answer 2

我有同样的问题，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。

然后您应该会发现您的树形菜单按预期工作。

Answer 3

不要禁用 turbolinks，因为它会加速 rails 应用程序中页面之间的导航，而不是禁用你可以让它工作之前我会解释为什么它不工作。
在使用Jquery时，$(function(){...})shorthand绑定文档就绪事件，常用。
不幸的是，默认配置下它不适用于 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));
  });
});

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

adminLTE 2.4.5 treeview not working properly after refresh only it is working in rails

javascript

css

ruby-on-rails-5.2

adminlte