我有一个页面3 div里程碑,achievedMilestones,inProgressMilestones
有一个操作可以更改里程碑的状态,以便在两种状态之间切换。
这就是风景
<div id="milestones" class="hidden p-4 flex flex-col gap-y-3" data-tabs-target="panel">
<%= render @goal.milestones %>
</div>
<div id="achievedMilestones" class="hidden p-4 flex flex-col gap-y-3">
<%= render @goal.milestones.where(status: 'achieved') %>
</div>
<div id="inProgressMilestones" class="hidden p-4 flex flex-col gap-y-3">
<%= render @goal.milestones.where(status: 'in_progress') %>
</div>
字符串
这是控制器动作
def update_progress
@milestone.update_progress(params[:status])
respond_to do |format|
format.turbo_stream do
if params[:status] == "achieved"
render turbo_stream: [
turbo_stream.prepend("achievedMilestones", @milestone),
turbo_stream.replace(@milestone, partial: 'milestone', locals: { milestone: @milestone })
]
elsif params[:status] == "in_progress"
render turbo_stream: [
turbo_stream.prepend("inProgressMilestones", @milestone),
turbo_stream.replace(@milestone, partial: 'milestone', locals: { milestone: @milestone })
]
end
end
end
end
型
有没有一种方法可以将元素从它的旧div中移到正确的div中,而不像
turbo_stream.remove("#achievedMilestones #milestone_#{@milestone.id}"),
型
还是应该直接使用StimulusJS
1条答案
按热度按时间kg7wmglp1#
你也可以共享
_milestone.html.erb
文件,也许你也可以发送字符串local到
_milestone
partial,用于不同的状态:字符串
并将其注入dom_id中,如=>
#{parentId}_#{milestone.id}
in _milestone.html.erb型
现在你可以在turbo_stream中使用这个div元素:
型