React on Rails中访问Devise用户字段时属性丢失问题排查

这个问题很常见，核心原因是Rails将ActiveRecord对象序列化为JSON传递给React时，默认不会包含Devise扩展的额外属性——invitation_accepted_at是Devise Invitable模块添加的字段，不在Rails默认的序列化白名单里，所以当你把@users传给react_component时，这个属性被自动过滤掉了。

下面是几种可行的解决方案：

方案1：在User模型中重写as_json方法，指定要包含的属性 #

直接在你的user.rb模型里定义序列化规则，确保invitation_accepted_at被包含进去：

class User < ApplicationRecord
  # 你的Devise配置，比如 :invitable 等
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :validatable, :invitable

  def as_json(options = {})
    # 保留默认属性的同时，添加需要的Devise字段
    super(options.merge(include: [:invitation_accepted_at]))
    # 如果你想精确控制哪些属性被包含，也可以用only：
    # super(options.merge(only: [:id, :email, :invitation_accepted_at]))
  end
end

这样当Rails把@users序列化为JSON时，就会自动带上invitation_accepted_at属性。

方案2：在控制器中手动构建传递给React的用户数据 #

如果你不想修改模型的全局序列化规则，可以在users_controller.rb里手动处理用户数据，只传递需要的属性：

def index
  @users = User.all.map do |user|
    user.attributes.slice('id', 'email', 'invitation_accepted_at')
    # 或者用as_json指定字段：
    # user.as_json(only: [:id, :email, :invitation_accepted_at])
  end
end

这种方式更灵活，只会在这个控制器动作里包含指定属性，不会影响其他地方的序列化行为。

验证步骤 #

在修改后，你可以先在users/index.html.erb里临时输出序列化后的结果，确认invitation_accepted_at是否存在：

<%= @users.to_json %>

如果能看到这个属性，再传递给React组件就没问题了。

额外注意 #

确保你已经运行了Devise Invitable的迁移，数据库里确实存在invitation_accepted_at字段——如果数据库里都没有这个字段，那肯定无法获取到它。

内容的提问来源于stack exchange，提问作者Shelby S