Турбо: как переоценить некоторые js-файлы после рендеринга?
Я все еще новичок в Hotwire. У меня есть эта проблема, которая, я думаю, является общей проблемой для Turbo. Я помню, что раньше он был у меня в Turbo-Links, потому что в итоге я всегда деактивировал его в своих проектах.
Проблема, похоже, в том, что файлы .js не оцениваются повторно после загрузки фрейма.
Эти JS имеют некоторую логику после рендеринга, например «подсказки» Bootstrap, которые требуют, чтобы селектор запроса прошел через все соответствующие элементы и активировал функциональность.
Я безуспешно искал в Google:
- Rails Turbo: переоценка JS
- рельсы javascript_include_tag и турбо-перезагрузка
Как я могу попросить Turbo переоценить некоторые из моих js-файлов, импортированных с помощью javascript_include_tag, как здесь?:
<%= javascript_include_tag "phoenix/vendors/dayjs/dayjs.min.js" %>
<%= javascript_include_tag "phoenix/assets/js/phoenix.js" %>
Я ожидал чего-то вроде:
<%= javascript_include_tag "phoenix/assets/js/phoenix.js", turbo_reload: true %>
Причина, по которой вы ничего не находите, заключается в том, что неимпотентные и неделегированные обработчики событий являются известной проблемой не только с Turbo, но и с каждой существующей средой JavaScript, которая динамически вставляет содержимое в DOM. В конечном итоге они либо ничего не делают, либо снова и снова подключают один и тот же обработчик событий. Мой совет — просто выбирайте библиотеки, которые не такие дерьмовые.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вероятно, вы ищете прослушиватель турбо:кадровой загрузки.
Вот пример:
document.documentElement.addEventListener('turbo:frame-load', function (e) {
// Initialize bootstrap tooltips and other logic here
});
Некоторое время назад я ответил на аналогичный вопрос: stackoverflow.com/questions/73359149/… Но если вы не используете Stimulus, вы можете добавить несколько наблюдателей мутаций в свой JS. Хотя Turbo хорошо работает со Stimulus.