Rails中Best In Place初始日期格式适配I18n本地化问题

问题表现 #

• 普通展示类日期通过<%=l @client.active_date.to_date %>调用时，可正常跟随当前locale配置格式化
• 使用Best In Place（简称BIP）实现行内编辑的日期字段，非编辑初始状态固定显示yyyy-mm-dd格式，无法匹配本地化规则
• 点击触发编辑唤起jQuery datepicker时，日期可正常按照datepicker预设格式展示，仅初始态、编辑取消/提交后的回显态格式异常

具体实现步骤 #

• 单字段定制展示格式
  给BIP调用方法增加display_with参数，传入格式化逻辑，直接复用Rails内置的I18n日期本地化方法，修改视图代码如下：

  <span class="date-container">
    <%= best_in_place task, :due_date, 
          as: :date, 
          display_with: ->(date) { I18n.l(date.to_date) },
          class: 'hyperlink'  %>
  </span>
  

  display_with参数会接管字段非编辑状态的所有渲染逻辑，覆盖初始页面加载、编辑取消回显、提交成功后回显的单字段场景。

• 全局配置避免重复代码
  如果项目中有多处BIP日期字段，不需要每个字段单独写lambda，新建/修改BIP初始化配置文件config/initializers/best_in_place.rb，添加全局日期格式化规则：

  BestInPlace.configure do |config|
    # 全局接管日期类型字段的展示格式化
    config.respond_to_date = ->(date) { I18n.l(date.to_date) }
  end
  

  配置完成后重启Rails服务，所有as: :date的BIP字段都会默认走I18n本地化格式化逻辑。

• 前后端格式对齐校验
  需保证Rails locale配置文件中的默认日期格式，和jQuery datepicker的dateFormat配置规则一一对应，避免出现非编辑态、编辑态格式不一致的问题。例如中文场景下：

  • Rails端config/locales/zh-CN.yml配置：

    zh-CN:
      date:
        formats:
          default: "%Y-%m-%d"
    

  • jQuery端datepicker配置对应设置dateFormat: 'yy-mm-dd'即可。

注意事项 #

• 如果绑定的字段是datetime/timestamp类型，格式化前必须调用.to_date转成日期类型，否则I18n.l会按时间格式解析，导致展示结果不符合预期。
• 修改初始化配置文件后必须重启Rails服务，配置才会生效。

内容的提问来源于stack exchange，提问作者Pratham Majithia