アレイを渡してライフサイクル内にアクセスする方法

Question

私はMongo/Meteor 1.3/Reactを使用しています。私の簡単な例では、ラッパーReactコンポーネントを使用してMongoコレクションを照会し、配列を作成します。子コンポーネントに渡すと、コンストラクタが呼び出されたときにArrayオブジェクトが準備ができていないように思えます。つまり、私はその小道具にアクセスできません。

これは共通の問題である必要があるように感じます。私は別のReact Lifecycle Componentを使用すべきですか？またはwaitOn関数のいくつかの形式を追加しますか？何かアドバイスをいただきました！

親コンポーネント

export default class BulkMapWrapper extends TrackerReact(React.Component) { 

constructor() { 
super(); 
const subscription = Meteor.subscribe("listing",{sort: {_id:-1}}) 
this.state = { 
eventsData: subscription 
} 
} 


render() { 
var markerArray = [] 
markerArray = ... 


return(
<div className="panel panel-default"> 
<div className="panel-body"> 
<FourthMap 
mapParams = {manyEvents} 
markers = {markerArray} 
/> 
</div> 
</div> 
) 

子コンポーネント

export default class GooleMapComponent extends Component { 
constructor(props){ 
super(props) 
console.log(this.props.markers); 

Answer 1

あなたは、データを取得し、その結果得られたデータと新しい状態を設定するcomponentDidMount機能を使用する必要があります。

class GetData extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = {}; 
    } 

    componentDidMount() { 
    const subscription = Meteor.subscribe("listing",{sort: {_id:-1}}); 

    this.setState({ 
     eventsData: subscription 
    }); 
    } 
} 

その後、render関数内の別のコンポーネントに明示的にその子に小道具としてGetDataコンポーネントから状態を伝承たりすることができます。

これは一般にReactでAJAXリクエストを処理する方法ですが、これがMeteorでの使用に適しているかどうかはわかりません。