小道具が変更されたときにコンポーネントが再レンダリングするコンポーネント

Question

ParentとChildの2つのコンポーネントがあるとします。 Parentコンポーネントでは、lastNameという名前の状態があり、これはChildに渡されます。 ChildとParentの最初のレンダリングの後、がParentに変更された場合、Childコンポーネントは再レンダリングされますか？

Answer 1

はい、setStateでプロパティを設定するとします。しかし、Reactでの再レンダリングは、恐れてはならないもので、Virtual DOMの使用のために非常に効率的です。あなたが状態を更新する必要があるかもしれません、子コンポーネントで、その後、次の

shouldComponentUpdate(nextProps){ 
    return this.props.lastname !== nextProps.lastname 
} 

https://facebook.github.io/react/docs/component-specs.html#shouldComponentUpdate

を使用する必要があり、子コンポーネントで

Answer 2

。小道具lastNameは子供の中で使用されているときに、子コンポーネントのみが再レンダリングされるcomponentWillReceiveProps（nextProps）

componentWillReceiveProps(nextProps){ 
    this.setState({ 
    lastname: nextProps.lastname 
    }); 
} 

Answer 3

を使用することができることを実現するためにはlastNameを変更する機能や親使用setState機能をレンダリングします。 Reactは片方向のデータフローであることを覚えておいてください。子供の中に子コンポーネントを再レンダリングする場合は、setStateを親コンポーネントに戻すイベントを呼び出す必要があります。