Méthode componentWillUnmount() de React
Cycle de vie du composant React
Le format de la méthode componentWillUnmount() est le suivant :
componentWillUnmount()
La méthode componentWillUnmount() est appelée directement avant que le composant soit démonté et détruit.
Vous ne devez pas appeler setState() dans la méthode componentWillUnmount(), car le composant ne sera jamais rendu à nouveau. Une fois qu'une instance de composant est démontée, elle ne sera plus jamais montée.
Dans l'exemple suivant :componentWillUnmount()La méthode sera appelée lorsque le composant est sur le point d'être supprimé du DOM :
Exemple
class Container extends React.Component {
constructor(props) {
super(props);
this.state = {show: true};
}
delHeader = () => {
this.setState({show: false});
}
render() {
let myheader;
if (this.state.show) {
myheader = <Child />;
};
return (
<div>
{myheader}
<button type="button" onClick={this.delHeader}>Supprimer le composant titre</button>
</div>
);
}
}
class Child extends React.Component {
componentWillUnmount() {
alert("Le composant titre est sur le point d'être démonté.");
}
render() {
return (
<h1>Hello Example!</h1>
);
}
}
Essayez-le »