Как очистить переменные окна при использовании turbolinks

Question

Использование рубинов на рельсах, у меня есть код, который запускается со следующим скриптом кофе;

$ = jQuery 
$(document).on "turbolinks:load", -> 
    if window.progress? 
    // execute code on a div with an id of ```target``` 

На страницах, где код предназначен для запуска, у меня есть DIV с идентификатором target и тег сценария, который загружает параметр progress например

<%= javascript_tag id: "window_vars" do %> 
    window.progress = <%= raw graph.data.to_json %> 
<% end -%> 

Если нет turbolinks, то работает нормально, код триггеров на страницах, где оно означало, чтобы и не вызвать на других страницах. Тем не менее, если я включу turbolinks 5.0.1, и я нахожусь на странице, где код не означает триггер, то на страницу, где код запускается, а затем обратно на страницу, где код не предназначен для запуска, триггеры кода на последней странице с исключением. Кажется, что turbolinks не очищает переменную window.progress между загрузками страниц.

Как я могу убедиться, что переменные окна, загруженные через сценарий, очищаются между страницами?

Answer 1

Сегодня я столкнулся с этой проблемой, занимаясь чем-то подобным. Я предположил, что глобальные переменные сохраняются между посещениями турболинков. Это действительно имеет смысл, поскольку страница не перезагружается; содержимое просто перезаписывается. Мое решение состояло в том, чтобы уничтожить данные, прежде чем turbolinks отобразит новую страницу.

document.addEventListener('turbolinks:before-render',() => { 
    delete window.progress; 
}) 

Обратите внимание, что метод delete не работает с яваскриптом переменными, объявленными с var, но делает работу для атрибутов, присвоенных window как в моем случае. Если вы используете var, вам нужно будет сделать var progress = null;

У вас есть a lot of options, где это можно сделать в жизненном цикле запроса. Я выбрал before-render для обеспечения того, чтобы данные были «уничтожены», если запрос был успешным.

Answer 2

Обходной путь заключается в том, чтобы не полагаться на window.progress, чтобы определить, присутствует ли граф, скорее используйте идентификатор, например.

if $('#target').length > 0