Reagiert Re-Renders-Komponente, wenn eine Requisite geändert wird

Question

Angenommen, ich habe zwei Komponenten namens Parent und Child. In Komponente habe ich einen Zustand mit dem Namen lastName, die an Child als Prop übergeben wird. Nun, nach dem ersten Rendering von Child und Parent, wenn die lastName in Parent geändert wird, wird es Child Komponente zu rerender verursachen?

Answer 1

Ja, wenn Sie die Eigenschaft über setState einstellen. Re-render in React ist jedoch nicht etwas, vor dem Sie Angst haben sollten, es ist sehr effizient aufgrund der Verwendung von Virtual DOM.

Answer 2

In der untergeordneten Komponente sollten Sie die

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

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

Danach wird in der untergeordneten Komponente folgende verwenden müssen Sie möglicherweise den Zustand aktualisieren. Um das zu erreichen, dass Sie componentWillReceiveProps (nextProps)

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

Answer 3

Die Kinderkomponente nur gerenderte wieder wird verwenden können, wenn Requisiten ist lastName in Kinder Funktion und Eltern verwendet werden, die Verwendung setState Funktion machen lastName zu ändern. Denken Sie daran, Reaction ist unidirektionaler Datenfluss, wenn Sie Child-Komponente innerhalb des Child erneut rendern möchten, müssen Sie ein Ereignis aufrufen, das auch setState zurück zur übergeordneten Komponente