Das MDL-Menü funktioniert nicht, wenn der Benutzer bei Verwendung von Turbolinks auf die Zurück-Schaltfläche klickt

Question

Hier ist Code, um das MDL-Menü anzuzeigen. Sie klicken auf die Schaltfläche Bearbeiten und dann erscheint ein Menü.

<button class="mdl-button mdl-js-button mdl-js-ripple-effect" id="edit-button"> edit</button> 
<ul id="edit_menu" class="mdl-menu mdl-js-menu mdl-js-ripple-effect" for="edit-button"> 
    <li>change</li> 
    <li>do something else</li> 
</ul> 

Leider funktioniert das Dropdown nicht mehr, wenn der Benutzer auf die Schaltfläche Zurück auf die Seite mit dem Dropdown klickt. Ich kann MDL nicht neu initialisieren. Wenn ich auf einen Link im Menü klicke und dann auf die Zurück-Schaltfläche klicke, wird das Dropdown-Menü geöffnet. Irgendwelche Ideen?

Verwandte Problem war, dass Turbolinks bricht die MDL-Zeug, aber dieser Code behebt es. Leider wird das Drop-Down-Menü nicht repariert, wenn ein Benutzer auf die Zurück-Schaltfläche klickt.

Answer 1

Das eigentlich feste mein Problem

<meta name="turbolinks-cache-control" content="no-cache"> 

hinzufügen

Answer 2

Dies war meine Problemumgehung, um das Problem zu lösen. Es passierte nur für eine bestimmte Seite, also fand ich eine eindeutige Zeichenfolge in der URL und überschritt dann die Zurück-Schaltfläche, um einen Turbolinks-Besuch zu machen.

window.addEventListener "popstate", (e)-> 
    if (e.target.location.pathname.indexOf('customize_board') != -1) 
    Turbolinks.visit(e.target.location) 

Ich hoffe, dass zumindest jemandem helfen kann, damit ihre Seite nicht kaputt ist.

Answer 3

Ich hatte das gleiche Problem. Scheinbar passiert dies nur bei Verwendung der Zurück-Taste (nicht der Vorwärts-Taste). Meine Abhilfe war eine Javascript-Datei mit folgendem Inhalt

document.addEventListener "turbolinks:load", -> 
    componentHandler.upgradeDom() 

@addEventListener "popstate", (e)-> 
    Turbolinks.visit(e.target.location)