2016-10-26 11 views
0

내가 가지고있는 다음과 같은 데이터 관계를 반응한다. 예 :관리 관련 모델

그러나이 문제를 React로 추정하려고 할 때 문제를 올바르게 분리하는 방법에 어려움을 겪고 있습니다. 현재 newsfeed_items 구성 요소 :

# in components/newsfeed_items.jsx 
var NewsfeedItems = React.createClass({ 
    getInitialState: function() { 
    return {items: []}; 
    }, 
    loadItems: function() { 
    $.ajax({ 
     url: this.props.url, 
     dataType: 'json', 
     type: 'GET', 
     success: function(data) { 
     this.setState({items: data}); 
     }.bind(this) 
    }); 
    }, 
    componentDidMount: function() { 
    this.loadItems(); 
    }, 
    render: function() { 
    var items = this.state.data.map(function(item) { 
     return (<NewsfeedItem key={item.id} title={item.title} content={item.content} /> 
    }); 
    return (
     <div className="c-newsfeed-list"> 
     {items} 
     </div> 
    ); 
    } 
}); 

이 구성 요소는 newsfeed_items_controller에서 항목을 검색 : 나는이 likes와 JSON이에서 반환하는 newsfeed_itemscomments (연결된 경우) 내가 우려를 혼합 할 것 같은

# in newsfeed_items_controller.rb 
def index 
    respond_to do |format| 
    format.html 
    format.json {render json: @newsfeed_items} 
    end 
end 

보인다 newsfeed_items_path. 그러나 각각의 AYAX를 설정하기 위해서는 각 newsfeed_item에 대해 GET해야합니다. likescomments이 필요하지 않습니다.

모범 사례/최상의 해결책은 무엇입니까?

답변

1

여러 API 호출이 필요하지 않을 수도 있습니다. 이것은 당신이

  • 이 연관된 객체를 통합하는 모델 내에서 as_json 방법을 덮어 쓰기하는 API를 통해 주요 개체와 함께 사용자 정의 관련 개체를 전달할 수 있습니다

    1. JSON Builder Gem 다음은 두 가지 대안 내가 생산에 사용하고 있습니다. 기본적으로 render json: @newsfeed_items@newsfeed_items.to_json을 호출하므로 연결을 포함하는 메서드를 덮어 쓰면 원하는 것을 얻을 수 있습니다.
  • +0

    분명히 jBuilder 경로를 선택하겠습니다. 감사! – ReidasaurusRex