ruby-on-rails 涡轮响应渲染JavaScript警报?

brvekthn  于 2023-11-20  发布在  Ruby
关注(0)|答案(3)|浏览(115)

我正在重构turbostimulus的Rails控制器,并试图了解如何在Turbo中做应用程序目前使用JS响应模板做的事情。
things#show页面上,我有一个按钮来请求thing文本记录的“以前版本”。
目前,在Rails UJS中,此按钮向things/versions_controller#show操作发送GET JS请求。该操作通过为@versions设置ivar(包含从数据库中提取的版本文本)进行响应,并呈现一行js模板:

# things/versions/show.js.erb

alert('<%= @versions %>');

字符串
使用Turbo,我明白了,模板必须简单地呈现turbo_stream标记和更新/追加/替换页面元素。警报不在此范围内。
有没有可能直接将ruby ivar @versions传递给Stimulus控制器,从而显示js alert?我能想到的唯一方法是,Stimulus控制器将处理单击,向things/versions_controller#show操作发出获取请求(这将给予HTML响应),并处理响应本身。没有Turbo。
我想我可以让turbo response在页面中打印一个隐藏的@versions,并将该框架连接到一个刺激控制器,该控制器会在框架连接到DOM时立即将文本抛出警报。
我真的主要是想了解范例,找到最惯用的方法来做这样的事情,如果有一个。

3gtaxfhh

3gtaxfhh1#

如果你正在提交一个表单,那么你可以有一个创建或更新涡轮响应,呈现许多东西,而不仅仅是一个。
例如,create.turbo_stream.erb可以包含:

<%- # with a partial %>
<%= turbo_stream.replace("flash-container", partial: "/layouts/notices") %>
<%- # with embedded html %>
<%= turbo_stream.update("turbo-modal", "<turbo-frame id='turbo-modal'></turbo-frame>".html_safe) %>

<%- # with local variables %>
<%= turbo_stream.update("some-turbo-tag", partial: "path-to-partial", locals: { version: @version }) %>

<%- # remove page sections not needed %>
<%= turbo_stream.remove("some-turbo-tag"}) %>

字符串
如果它不是表单,而是链接,那么要获得完整的turbo流响应,而不是html,只需将data-turbo-stream或`data:{ turbo_stream:''}添加到您的link_to like

<%= link_to "click me, its fun", show_something_path, data: { turbo_stream: true } %>


使用流渲染的好处是你可以控制多个页面turbo帧。一个警告,这样做有一个长期存在的bug,所以确保你使用的是@hotwired/turbo-rails 7.3或更高版本。

uinbv5nw

uinbv5nw2#

我想你可以像这样返回JavaScript:

<turbo-stream action="append" target="some_target">
  <template>
    <script>
      alert('<%= @versions %>');
    </script>
  </template>
</turbo-stream>

字符串

kcrjzv8t

kcrjzv8t3#

我不太明白Stimulus在这里是如何参与的。除了其他答案,你可以定制一个Turbo Stream动作,让alert动作更好,更可重用:

// app/javascript/application.js

Turbo.StreamActions.alert = function () {
  alert(this.templateContent.textContent)
};

个字符
在控制器中使用它作为对 TURBO_STREAM 请求的响应:

respond_to do |format|
  format.turbo_stream do
    # without CustomTurboStreamActions module
    # render turbo_stream: turbo_stream.action(:alert, "#", @versions)

    # with CustomTurboStreamActions
    render turbo_stream: turbo_stream.alert(@versions)
  end
end

  • https:turbo.hotwired.dev/handbook/streams#custom-actions*

相关问题