结合`redirect_to`和`anchor`选项的示例

95 阅读1分钟

通常你会有一个像这样的应用屏幕。

Example company directory

在编辑完一个雇员的信息后,你会重定向到公司目录页面。

为了更有吸引力,你可以用一个anchor 来重定向,使浏览器自动滚动到最近更新的项目,并保持你在列表中的位置。

你可以将其与最被低估的Rails辅助工具--dom_id --结合起来,以获得一个真正干净的解决方案。

使用方法

你的控制器将完全相同,只是在重定向时将anchor 选项添加到路径帮助器中:

class EmployeesController < ApplicationController
  include ActionView::RecordIdentifier # adds `dom_id`

  def update
    @company = Company.find(params[:company_id])
    @employee = @company.employees.find(params[:id])

    if @employee.update(employee_params)
      redirect_to companies_path(@company, anchor: dom_id(@employee),
        notice: "Updated #{@employee.name}!"
    else
      render :edit, status: :unprocessable_entity
    end
  end

  private

  def employee_params
    params.require(:employee).permit(:name, :department, :location)
  end
end

只要确保你在视图中也使用dom_id

<div class="flex flex-col divide-y">
  <%= @company.employees.each do |employee| %>
    <%= content_tag :div, id: dom_id(employee) do %>
      <div class="flex flex-col space-y-2">
        <span class="font-bold"><%= employee.name %></span>
        <span class="text-gray-400">
          <%= employee.department %>
          &middot;
          <%= employee.location %>
        </span>
      </div>
    <% end %>
  <% end %>
</div>

这是一个小的调整,但它很容易做到,使你的应用程序更令人愉快。