Rails App/Bootstrap：如何修复下拉菜单？答案

【问题标题】：Rails App/Bootstrap: How to Fix Dropdown Menu?Rails App/Bootstrap：如何修复下拉菜单？
【发布时间】：2017-07-29 15:16:40
【问题描述】：

我正在学习 Michael Hartl 的 Rails 教程 (RoR 5)，并尝试创建一个下拉菜单作为 Web 应用程序的一部分。我已仔细按照 Hartl 的说明进行操作，但登录后无法让下拉菜单实际出现在页面上。

过去在 Stack Overflow 上讨论同一问题的主题已有 3 年以上的历史，因此提到的大多数 gem（和相应的解决方案）都已过时，似乎不适用于最新版本的 Rails（此教程使用版本 5.1.2)。

我尝试了以下修复（没有一个有效，有些会导致错误）：

在application.js中包含“require JQuery”和“require JQuery-ujs”
更改列出的顺序，以便在其他组件之前或之后加载引导程序
使用“require bootstrap-dropdown”，在较新的引导下载中可能已过时
在 coffee.js 文档中包含 $(document).dropdown 方法
多次重启网络服务器

我是 Rails 的初学者（通常是编程），因此非常感谢您提供的任何建议。

以下是看起来相关/有用的文档：

GEMFILE

source 'https://rubygems.org'

git_source(:github) do |repo_name|
  repo_name = "#{repo_name}/#{repo_name}" unless repo_name.include?("/")
  "https://github.com/#{repo_name}.git"
end


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.1.2'
#bcrypt for password hashing
gem 'bcrypt',         '3.1.11'
#Boostrap-Sass
gem 'bootstrap-sass', '3.3.7'

# Use Puma as the app server
gem 'puma', '~> 3.7'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# gem 'therubyracer', platforms: :ruby

# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
gem 'turbolinks', '~> 5'
gem 'jbuilder', '~> 2.5'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 3.0'
# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console
  gem 'byebug', platforms: [:mri, :mingw, :x64_mingw]
  gem 'sqlite3', '1.3.13'
  # Adds support for Capybara system testing and selenium driver
  gem 'capybara', '~> 2.13'
  gem 'selenium-webdriver'

end

group :development do
  # Access an IRB console on exception pages or by using <%= console %> anywhere in the code.
  gem 'web-console', '>= 3.3.0'
  gem 'listen', '>= 3.0.5', '< 3.2'
  gem 'spring'
  gem 'spring-watcher-listen', '~> 2.0.0'
end

group :test do
  gem 'rails-controller-testing', '1.0.2'
  gem 'minitest-reporters',       '1.1.14'
  gem 'guard',                    '2.13.0'
  gem 'guard-minitest',           '2.4.4'
end

group :production do
  gem 'pg', '0.18.4'
end

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]

app/javascripts/application.js：

//= require rails-ujs
//= require bootstrap
//= require turbolinks
//= require_tree .

_header.html.erb：

<header class="navbar navbar-fixed-top navbar-inverse">
  <div class="container">
    <%= link_to "sample app", root_path, id: "logo" %>
    <nav>
      <ul class="nav navbar-nav navbar-right">
        <li><%= link_to "Home", root_path %></li>
        <li><%= link_to "Help", help_path %></li>
        <% if logged_in? %>
          <li><%= link_to "Users", '#' %></li>
          <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>
        <% else %>
          <li><%= link_to "Log in", login_path %></li>
        <% end %>
      </ul>
    </nav>
  </div>
</header>

apps/views/layouts/_rails_default.html.erb：

<%= csrf_meta_tags %>

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

【问题讨论】：

标签： jquery drop-down-menu ruby-on-rails-5

【解决方案1】：

当我完成 Michael 的教程（2017 年 7 月）时，我最终从 gem 文件中删除了所有版本。这样，rails 只会加载每个版本的最新版本。所以改变：

gem 'bootstrap-sass', '3.3.7'

只是：

gem 'bootstrap-sass'

等等。为您的 gemfile 中的每个 gem。
在我从不同的过时且不兼容的 gem 中执行此操作之前，我遇到了各种奇怪的错误。
祝你好运！

【讨论】：

【解决方案2】：

我在使用 RoR 6 时遇到了同样的问题。经过一点调试后，我发现 _header 部分中的 logged_in? 辅助函数以某种方式输出 false 甚至在登录。我终于在 if 块之前添加了帮助程序 current_user。

<% current_user %>
<% if logged_in? %>
   .
   .
   .
<% end %>

这似乎是一种解决方法，但为我解决了！

【讨论】：