Angenommen, ich habe in React die folgende Paarung von Eltern- und Kindkomponenten:
%Vor% Wenn ich die forceUpdate mache, wird React versuchen, sie erneut zu rendern, da sich keine der Requisiten geändert hat, die an die ChildComponent übergeben wurden? Was ist, wenn ich 1000 solcher Kinder usw. habe?
Was mich beunruhigt, ist eine Situation, in der ich einen sehr tiefen ChildComponent habe, der einen ganzen massiven Baum von Nachkommen-Komponenten enthält, aber ich möchte nur einige relativ kosmetische Änderungen am ParentComponent vornehmen. Gibt es eine Möglichkeit, React dazu zu bringen, nur das übergeordnete Element zu aktualisieren, ohne zu versuchen, die untergeordneten Objekte erneut zu rendern?
Wenn React ParentComponent erneut rendert, wird ChildComponent automatisch neu gerendert. Die einzige Möglichkeit, sich fortzubewegen, ist shouldComponentUpdate in ChildComponent zu implementieren. Sie sollten this.props.a , this.props.b und this.props.c und ChildComponents eigenen Status vergleichen, um zu entscheiden, ob das Rendern erneut durchgeführt werden soll oder nicht. Wenn Sie unveränderliche Daten verwenden, können Sie einfach den vorherigen und nächsten Zustand und die Requisiten mit strikter Gleichheit === vergleichen.
Es gibt einige Dinge, die Sie mit Ihrem Code beachten sollten
forceUpdate , wenn Sie setState . Reagiert automatisch für Sie. Sie haben wahrscheinlich gemeint:
<ChildComponent a={this.props.a} b={this.props.b} c={this.props.c}/>
Tags und Links javascript reactjs react-jsx