Comment éviter les clics répétés en réaction

L'idée d'empêcher les clics répétés :

Une fois la demande de données lancée, la demande suivante ne peut être effectuée qu'après la fin de cette requête. Cliquez, sinon l'invite correspondante sera donnée.

Méthode spécifique :

Paramètres initiaux dans l'état :

state={
   bool:true,
}

Paramètres de l'événement de clic :

btn_click = async () => {
	this.setState({
	   bool: false,
	})
	.
	.
	.
	if(this.state.bool){
		const value = await fetch.bbb({})
		if (value.code == 1) {
		
		} else {
		
		}
		this.setState({
		bool: true,
		})
	}
}

Analyse :

Si bool est vrai, nous exécutons la requête. Si plusieurs clics se produisent, le bool:false défini au début de la méthode prendra effet pour empêcher le traitement de la requête avant qu'elle ne soit terminée. request;

Ensuite, une fois la requête terminée, nous modifions le statut de Bool afin que la requête suivante puisse être faite une fois cette requête terminée.

Quant au fait que la méthode est définie sur false au début et que la requête est toujours exécutée, cela est dû à un mécanisme asynchrone. Si l'état est défini dans la même méthode puis appelé à nouveau, le L'état ne sera pas mis à jour à temps, mais il sera mis à jour la prochaine fois que la méthode sera appelée.

Recommandations associées : Tutoriel vidéo React

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!