Как вставить форму для новой записи с помощью Турбо/стимуляторов?

#ruby-on-rails #ruby-on-rails-6 #hotwire-rails #turbo

Вопрос:

Будущее Rails, похоже, уходит от UJS в сторону Турбо и стимула. Но некоторые функции, похоже, требуют большего количества кода и большей работы по сравнению с UJS старой школы.

Например: Чтобы вставить встроенную форму, которая позволила бы создать новую запись, вы можете создать ссылку, например:

 link_to 'add record', new_user_path, remote: true
 

затем в контроллере:

 def new
  @user = User.new
  respond_to do |format|
     format.js
  end
end
 

и, наконец, новое представление.js.erb, содержащее содержимое (форму), которое должно быть выполнено в ответ на новое действие.

Можно было бы подумать, что это будет просто преобразовать в Турбо, просто ответив на:

 def new
  @user = User.new
  respond_to do |format|
     format.turbo_stream
  end
end
 

а затем измените new.js.erb на new.turbo_stream.erb с таким контентом, как:

 <turbo-stream action='append' target="<%= dom_id @user %>_new_form">
  <template>
      ...the user form stuff...
  </template>
</turbo-stream>
 

Однако турбо-потоки не обрабатывают запросы GET. Итак, этот подход не работает.

Мой вопрос: каков способ Rails 7 справиться с этим? Я не думаю, что UJS-это ответ, так как Турбо и Стимул «заменяют» функциональность UJS. Возможно, ответ заключается в том, чтобы вставить новую форму с помощью стимула, а затем использовать поток для вставки последующей новой записи после запроса POST, когда форма успешно выполнит действие «Создать». Но, похоже, это намного больше работы, чем UJS есть/был. Это заставляет меня думать, что должен быть более простой, более гибкий и менее кодовый способ справиться с этим.

Ответ №1:

Для этого я бы использовал turbo-frames :

  • Сначала сделайте пустой turbo-frame вызываемый new_record
  • Затем вы можете получить ссылку и установить data-turbo-frame="new_record"

    это будет действовать так, как если бы вы нажали на ссылку внутри new_record turbo-frame

  • Затем на новом шаблоне сделайте соответствующую turbo-frame обертку вашей формы, а затем
  • Когда вы нажмете на кнопку «Новая запись», она поместит форму новой записи в нужное место, я бы сказал, что это самый эффективный способ сделать это.