Reactでは、どのようにして、親が別のコンポーネントのプロットまたは状態値をプログラムで変更することができますか？

Question

私は別のコンポーネントを作成してレンダリングしました。ボタンをクリックすると、いくつかの計算を行い、その他のコンポーネントのいくつかの小道具を変更してそのビューを更新したいと思います。どうすればいい？

小道具の代わりに州の値である必要がある場合は、問題ありません。他のコンポーネントからsetState()を呼び出すことはできますか？

class MainComponent extends React.Component { 

    other: null, 

    constructor(props, children) 
    { 
     //Create the component 
     this.other = ReactDOM.render(otherReactElement, document.body); 
    } 

... 

    //An on Click handler 
    handle: function(evt) 
    { 
     //This is what I want to do 
     other.setProps({ aPropToChange: "new value" }); 
    } 
}; 

"setProps"は推奨されていません。そんなことを可能にするために他に何ができますか？

Answer 1

otherに新しい小道具を渡したい場合は、hereと表示されているように、新しい小道具でReactDOM.render()を再度呼び出す必要があります。

私はjsfiddleを作成しました。propsとstateを正しく更新する方法を知ることができます。

Answer 2

Reactでは、親コンポーネントはrefを使用して子コンポーネントの状態を変更できます。リファレンスを使用すると、子コンポーネントへの参照が取得され、その参照を使用して子コンポーネント内の関数を呼び出すことができ、その関数はその中にsetState（）呼び出しを持つことができます。

反応参照の詳細はこちらhttps://facebook.github.io/react/docs/more-about-refs.html#the-ref-callback-attribute