#はじめに
以前jQuery
を使ってタブメニューの切り替えを実装したときに、
ビューを開いた__初回__は非同期で切り替わるのに、
別のページに移動したり
「戻る」ボタンを押したあと再びタブメニュー画面に戻ると、、、、
動かない、、、!なぜだ、、!
なんて経験をして1日無駄にしたことがあります。
__jQueryやビュー画面のコードは間違ってないはず!なぜ!__って人向けの記事です。
#解決方法①
各link_to
ごとにturbolinks
とやらを無効にすればOKです。簡単です。
<%= link_to "ホーム", root_path, data: {"turbolinks" => false} %>
data: {“turbolinks" => false}
は遷移先ページのみturbolinks
を切ることが出来ます。
※turbolinks
とは、ページ遷移をAjax
に置き換え、JavaScript
やCSS
のパース(解析・変換)を省略することで高速化するgem
で、Rails4
からはデフォルトで使用されています。↓
gem 'turbolinks', '~> 5'
#解決方法②
js
ファイルに"turbolinks:load"
を記述すればOKです。簡単です。
document.addEventListener("turbolinks:load", function() {
// ...
})
#まとめ
turbolinks
を無効化する方法として、__gem
ファイルから直接削除__する方法もあるようですが、
元々turbolinks
はページの読み込みを__高速化するgem__です。
ボタンを押すたびに画面が初期化され、
一旦真っさらになった後、再度js
やらcss
を読み直す。。。待ってられません。
その辺の処理をTurbolinks5
が全部やってくれているんです。
なるべく
①個別のページ(link_toごと)に無効にするか、
②jsファイルにコードを加えるだけにしましょう。