时间戳

首页 > 解决方案 > 由于 Turbolinks on rails，页面自动刷新

ruby-on-rails - 由于 Turbolinks on rails，页面自动刷新

问题描述

在我的 Rails 应用程序上，我的一些页面会自动刷新，没有任何明显的原因。在我的控制台中，我收到以下消息：

turbolinks.self-2db6ec539b9190f75e1d477b305df53d12904d5cafdd47c7ffd91ba25cbec128.js?body=1:7 您正在从元素内的元素加载 Turbolinks。这可能不是你想要做的！

而是在元素内加载应用程序的 JavaScript 包。元素在每次页面更改时进行评估。

有关更多信息，请参阅：https ://github.com/turbolinks/turbolinks#working-with-script-elements

data-turbolinks-suppress-warning通过将属性添加到以下内容来抑制此警告：<script src="/assets/turbolinks.self-2db6ec539b9190f75e1d477b305df53d12904d5cafdd47c7ffd91ba25cbec128.js?body=1" data-turbolinks-track="reload"></script>

当我在 application.html.erb 文件中评论我的标题部分时，错误消息消失了，但它非常基本

    <!DOCTYPE html>
    <html>
      <head>
        <title>Myleagueproject</title>
        <%= render "layouts/header" %>
        <%= csrf_meta_tags %>

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

  <body>
    <% flash.each do |key, value| %>
        <div class="alert alert-<%= key %>"><%= value %></div>
    <% end %>
    <%= yield %>
  </body>
</html>

和我的标题：

<header>
  <nav class="navbar navbar-expand-md" style="background-color: black;">
    <% if player_signed_in? %>
        <div class="navbar-collapse collapse w-100 order-1 order-md-0 dual-collapse2">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item">
                    <%= link_to root_path, class: 'header' do%>
                    Hi <%=current_player.name%>
                    <% end %>
                </li>
            </ul>
        </div>
        <div class="mx-auto order-0">
            <%= image_tag("logo.png", :class => "logo", style: 'height:50px;width:auto;')%>
        </div>
        <div class="navbar-collapse collapse w-100 order-3 dual-collapse2">
            <ul class="navbar-nav ml-auto">
                <li class="nav-item">
                    <%= link_to "My Leagues", leagues_path, class: 'header' %>
                </li>
                <li class="nav-item">
                    <%= link_to "Log out", destroy_player_session_path, method: :delete, class: 'header' %>  
                </li>
            </ul>
        </div>
    <% else %>
        <div class="navbar-collapse collapse w-100 order-3 dual-collapse2">
            <ul class="navbar-nav ml-auto">            
                <li class="nav-item">
                    <%= link_to "Log in", new_player_session_path, class: 'header' %>
                </li>
            </ul>
        </div>
    <% end %>
  </nav>
</header>

我只是不明白，你知道我应该改变什么吗？谢谢 ！

标签： ruby-on-railsturbolinks

解决方案

<header>中不允许使用元素<head>，即使它们的名称相似。这<head>是您的文档的头部，元数据、脚本、链接和标题标签属于其中。该<header>元素表示文档<body>或其后代之一中的介绍性内容。

我敢打赌，这就是导致问题的原因。移动<%= render "layouts/header" %>到您的开始<body>标签下方。

您可以在此处阅读有关<header>标签及其允许位置的更多信息：https ://developer.mozilla.org/en-US/docs/Web/HTML/Element/header

推荐阅读