ReactJS如何处理Rails活动记录关联

Question

我正在迭代用户的帖子项目.我可以根据我的关系列出项目而不是他们的个人资料:

邮政模式:

belongs_to :user

档案型号:

belongs_to :user

用户模型:

has_many :posts
has_one :profile

PostsController:

class PostsController < ApplicationController
  respond_to :json

  before_action :set_post, only: [:show, :edit, :update, :destroy]
  before_action :only_current_user, except:[:show, :interest]

  # GET /posts
  # GET /posts.json
  def index
    @user = User.friendly.find( params[:user_id] )
  end
  [...]
end

索引页面控制器:

class PagesController < ApplicationController

    respond_to :json

    def index
        @users = User.all
        @posts = Post.all.order("created_at DESC")
    end
   [...]
end

没有JS,我得到的值是:

<% @posts.each do |s| %>
 <%= s.user.profile.business_name %>
 <%= s.post_type %>
 <%= s.<all others> %>
<% end %>

现在使用React,我可以使用react-rails gem:

var Posts = React.createClass({

  render: function() {

    var createItem = (p) => (

    <div className="row">
      {p.post_type}
      {p.foobar}
      {p.user.name} //this does not work
    </div>

    );

    return (
      <div className="panel">
        {this.props.posts.map(createItem)}
      </div>
    );

  }
});

Index.html.erb:

<%= react_component('Posts', { posts: @posts } %>

我以为我得到了答案但是这只是在我只希望用户使用相关帖子时吐出所有用户:

<%= react_component('Posts', { posts: @posts,
                               users: @users } %>

然后我会在js中添加道具,但这不是我想要的.

在我的控制台中似乎有一个线索,我想弄清楚:

"警告:数组或迭代器中的每个子节点都应该有一个唯一的"key"prop.检查Posts的render方法.

Answer 1

我不认为警告与问题有任何关系,但只是为了摆脱它,你可以在React组件中添加关键道具,如下所示:

var Posts = React.createClass({

  render: function() {

    var createItem = (p) => (

    <div className="row" key={p.id}>
      {p.post_type}
      {p.foobar}
      {p.user.name} //this does not work
    </div>

    );

    return (
      <div className="panel">
        {this.props.posts.map(createItem)}
      </div>
    );

  }
});

至于真正的问题,请尝试更改@posts类似的分配@posts = Post.all.includes(:user).as_json(include: { user: { only: [:name] } })

我的猜测是你只是查询帖子.默认情况下as_json(返回json数据时调用的方法)不包含关联,因此您不会在响应方面获得任何内容.