Переинициализировать редактор trix с помощью Tubolinks

Я пытаюсь заставить турболинки и трикс работать вместе после использования пользовательского метода обработки ошибок с турболинками, когда я заменяю тело документа на HTML, отправленный с сервера.

// administration.js

import Rails from 'rails-ujs'
import Turbolinks from 'turbolinks'
import Trix from 'trix'
Rails.start();
Turbolinks.start();

// TURBOLINKS - ERROR HANDLING
document.addEventListener("ajax:error", (e) => {
  if (e.detail[2].status !== 422) { return }
  document.body = e.detail[0].body
  Turbolinks.dispatch("turbolinks:load")
  scrollTo(0, 0)
})

<!-- form.html -->
<div class="small-10 columns">
  <input type="hidden" id= "body" %>
  <trix-editor input="body"></trix-editor>
</div>

Есть ли способ реинициализировать редактор trix или я должен забыть заменить тело документа в json?

1 ответ

Это мое исправление:

html : 
<%= f.hidden_field :body, id: "body", data: { behavior: "trix-editor" } %>

js :
document.addEventListener("turbolinks:load", () => {
  const trixField = document.body.querySelector("[data-behavior='trix-
  editor']")
  if (document.body.contains(trixField)) {
    const fieldId = trixField.attributes["id"].value
    const trixEditor = document.createElement("trix-editor")
    trixEditor.setAttribute("input", fieldId)
    const parentDiv = trixField.parentNode
    parentDiv.insertBefore(trixEditor, trixField)
   }
});
Другие вопросы по тегам