ReactJS如何处理轨道活动记录关联

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 %> 

现在有了反应，我可以使用反应 - 铁路这个宝石：

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中添加道具，但那不是我想要的。

似乎有在我的控制台一个线索，我想弄清楚：

“警告：在数组或迭代每个孩子都应该有一个独特的‘钥匙’的道具检查渲染方法。的帖子

Answer 1

我不认为该警告有什么做的问题，但只是为了摆脱它，你可以像这样在阵营组件添加的关键道具：

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数据时调用的方法）不包含关联，因此在反应方面你不会得到任何东西。