Rails 5アプリケーションの `application.js`にターボリンクをどうすればいいですか

Question

比較的新しいRails 5アプリケーションをビルドしています。私はbootsyの宝石を使用していましたが、私はページが更新されるまで、そのページに表示されないという問題が発生しています。しばらく再生した後、application.jsからturbolinksを削除すると、ページが更新されずに初めてWYSIWYGが表示されることがわかりました。私がどのようにしてturbolinksを私のapplication.jsに必要としなければならないか教えてもらえますか？前もって感謝します。

application.js：

//= require jquery 
 
//= require jquery_ujs 
 
//= require jquery.turbolinks 
 
//= require bootstrap-sprockets 
 
//= require bootsy 
 
//= require turbolinks 
 
//= require_tree .

application.scss：

@import "bootstrap-sprockets"; 
 
@import "bootstrap"; 
 
@import "bootsy"; 
 
@import "articles";

gemfile：

source 'https://rubygems.org' 
 

 

 
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
 
gem 'rails', '5.0.0' 
 
# Use postgresql as the database for Active Record 
 
gem 'pg', '~> 0.15' 
 
# Use SCSS for stylesheets 
 
gem 'sass-rails', '~> 5.0' 
 
# Use Uglifier as compressor for JavaScript assets 
 
gem 'uglifier', '>= 1.3.0' 
 
# Use CoffeeScript for .coffee assets and views 
 
gem 'coffee-rails', '~> 4.1.0' 
 
# See https://github.com/rails/execjs#readme for more supported runtimes 
 
# gem 'therubyracer', platforms: :ruby 
 

 
# Use jquery as the JavaScript library 
 
gem 'jquery-rails' 
 

 
gem 'jquery-turbolinks' 
 
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks 
 
gem 'turbolinks' 
 
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder 
 
gem 'jbuilder', '~> 2.0' 
 
# bundle exec rake doc:rails generates the API under doc/api. 
 
gem 'sdoc', '~> 0.4.0', group: :doc 
 

 
gem 'simple_form' 
 

 
gem 'bootstrap-sass' 
 

 
gem 'bootsy'

私はbootsyと組み合わせてsimple_formを使用していますので、私のフォームは次のようなものになります。あなたが好きturbolinks:loadイベントを使用する必要が

<%= simple_form_for @article, url: action_path do |f| %> 
 
    <%= f.input :title %> 
 
    <%= f.input :body, label: "Article Body", as: :bootsy %> 
 
    <%= f.submit %> 
 
<% end %>

Answer 1

周りを少し遊んだ後、解決策が見つかりました。私はapplication.jsにdocument.addEventListener('turbolinks:load', Bootsy.init);を追加しました。これが問題を解決しました。

Answer 2

をthis：

$(document).on('turbolinks:load', ready) 

function ready() { 
    //your code here 
} 

これだけです。