Как заставить выпадающую форму работать в Ruby On Rails - PullRequest
1 голос
/ 12 марта 2020

Я хочу добавить раскрывающуюся форму на панели навигации в моем приложении Rails, однако раскрывающаяся форма случайным образом перестанет работать. Иногда это работает нормально, но иногда мне нужно обновить страницу sh, чтобы она работала.

Я использую Rails версии 6.2.1.

Это мое приложение. html .erb:

<!DOCTYPE html>
<html>
  <head>
    <title><%= full_title(yield(:title)) %></title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>
  <body id="main-body">
    <div class="container">
      <%= render 'layouts/header'%>
      <%= yield %>
    </div>
  <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
  </body>
</html>

И это код для выпадающего Форма в заголовке:

<li class="dropdown">
  <a href="#" class="dropdown-toggle" data-toggle="dropdown">
    Account <b class="caret"></b>
  </a>
  <ul class="dropdown-menu">
    <li><%= link_to "Profile", current_user %></li>
    <li><%= link_to "Settings", '#' %></li>
    <li class="divider"></li>
    <li>
      <%= link_to "Log out", logout_path, method: :delete %>
    </li>
  </ul>
</li

Я заметил, что если я удаляю

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

, выпадающий список будет работать, но это вызывает другие проблемы. Например, глагол DELETE в routs.rb вызовет ошибку.

1 Ответ

1 голос
/ 13 марта 2020

Возможно, это произойдет, когда вы перейдете к рассматриваемой странице с другой другой страницы (напрямую не вставляя URL). При включенных турболинках JavaScript будет обрабатывать загрузку страницы вместо браузера. Это означает, что такие вещи, как document.onload, не запускаются.

Один из ваших плагинов может присоединиться к такому событию.

Большинство плагинов JavaScript имеют дескриптор для вручную повторно инициализируйте их. В этом сценарии вы сможете вызвать его, когда turbolinks завершит загрузку страницы .

document.addEventListener("turbolinks:load", function() {
  ThirdPartyLibrary.initialize();
});

В качестве альтернативы вы можете удалить зависимость турболинки от вашего проекта. Это позволяет страницам вести себя как обычно и также должно решить проблему.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...