ruby > 2.6.5
rails > 5.2.4.2
$(document).ready(function(){
$("#menu").on("click", function() {
$(this).next().slideToggle();
});
});
Mit jquery habe ich ein gewöhnliches Hamburger-Menü zum Öffnen und Schließen hinzugefügt. Abgesehen von den guten und schlechten Eigenschaften des JS-Codes sollte es im Betrieb kein Problem geben.
Es funktioniert zum Zeitpunkt des ersten Ladens einwandfrei. Das Verhalten ist zum Zeitpunkt des Seitenübergangs und des Zurücks des Browsers seltsam. Es entzündet sich mit einem Klick, öffnet und schließt sich jedoch und ist instabil. Es funktioniert normal, wenn es neu geladen wird.
Es funktioniert, also ist vielleicht der Ladezeitpunkt falsch?
→ Sie können nicht einmal alles wie ready`` onload`` ajaxStop ausprobieren.
Nach Rücksprache mit Herrn Google habe ich eine solche Beschreibung gefunden
$(document).on('turbolinks:load', function () {
...
});
turbolinks: load Ich habe das noch nie gesehen ...
Anscheinend ist es eine Rails-spezifische Beschreibung.
Ich habe auf diesen Artikel verwiesen. Turbolinks-Spickzettel
Mit anderen Worten, diese Funktion scheint diesmal JS beeinflusst zu haben.
Da es sich um einen Edelstein handelt, kann er durch Löschen gelöst werden, wird jedoch nicht gelöst. Ich habe nachgeforscht, wie ich damit umgehen soll.
Dies ist die Hauptbehandlung.
Wenn Sie im Link selbst "{" turbolinks "=> false}" angeben Für diesen Link sind Turbolinks deaktiviert.
<%= link_to "HOGE", root_path, data: {"turbolinks" => false} %>
<%# => <a data-turbolinks="false" href="/">HOGE</a> %>
Wenn Sie dies schreiben, können Sie Turbolinks definitiv entfernen. Es scheint gut zu sein, wenn Sie nur ein bestimmtes Skript steuern, aber es scheint schwierig zu sein, alles zu beschreiben ...
Löschen Sie diese Zeile
Gemfile
#gem 'turbolinks', '~> 5'
Terminal
$ bundle update
app/assets/javascripts/application.js
//= require turbolinks #Löschen Sie diese Zeile
erb:app/views/layouts/application.html.erb
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
"Data-Turbolinks-Track": Entfernen Sie "Nachladen". Es wurde jetzt deaktiviert. Es kann sicher sein, dass es deaktiviert wird, es sei denn, es handelt sich um eine Site, die JS stark nutzt. 3. Passen Sie die Turbolinks nicht an das JS-Laden an. Wie bei ready`` onload usw. können Sie mit dieser Beschreibung laden, ohne die Turbolinks anzupassen.
$(document).on('turbolinks:load', function () {
...
});
Darüber hinaus können Sie den Zeitpunkt für das Anbringen von Turbolinks ändern. Wenn Sie mehr wissen möchten, klicken Sie bitte hier. [Nehmen Sie andere Lebenszyklusereignisse auf](https://qiita.com/morrr/items/54f4be21032a45fd4fe9#%E3%81%9D%E3%81%AE%E4%BB%96%E3%81%AE%E3 % 83% A9% E3% 82% A4% E3% 83% 95% E3% 82% B5% E3% 82% A4% E3% 82% AF% E3% 83% AB% E3% 82% A4% E3% 83 % 99% E3% 83% B3% E3% 83% 88% E3% 82% 92% E3% 81% A8% E3% 82% 8B "Nehmen Sie andere Lebenszyklusereignisse")
Ich denke, dies ist diesmal die beste Lösung, da die Feinabstimmung für jedes Skript funktioniert.
Ist Turbolinks eine großartige Funktion oder eine laute Funktion ... Ich kann es auch nicht sagen, lol Ich bin sicher, dass es standardmäßig installiert werden sollte, aber ... Wenn Sie wissen, wie Sie es effektiver einsetzen können, hinterlassen Sie bitte einen Kommentar!
Recommended Posts