React componentDidUpdate()-Methode
React-Komponenten-Lebenszyklus
Das Format der Methode componentDidUpdate() ist wie folgt:
componentDidUpdate(prevProps, prevState, snapshot)
Die Methode componentDidUpdate() wird unmittelbar aufgerufen, nachdem die Komponente aktualisiert wurde.
Diese Methode wird während des anfänglichen Renderns nicht ausgeführt.
Sie können setState() auch direkt in componentDidUpdate() aufrufen, beachten Sie jedoch, dass es in eine bedingte Anweisung eingebettet werden muss.
Das folgende Beispiel verwendetcomponentDidUpdate()Die Methode wird ausgeführt, nachdem die Komponente aktualisiert wurde; die Komponente verwendetcomponentDidMount()Die Methode wird1Die Änderungsoperation erfolgt nach Sekunden:
Beispiel
class Header extends React.Component {
constructor(props) {
super(props);
this.state = {favoritesite: "example"};
}
componentDidMount() {
setTimeout(() => {
this.setState({favoritesite: "google"})
}, 1000)
}
componentDidUpdate() {
document.getElementById("mydiv").innerHTML =
"Nach der Aktualisierung ist der Favorit" + this.state.favoritesite;
}
render() {
return (
<div>
<h1>Meine Lieblingswebsite ist{this.state.favoritesite}</h1>
<div id="mydiv"></div>
</div>
);
}
}
Selbst ausprobieren »