1
votes

Le crochet du compteur React ne s'incrémente pas

Lorsque je clique sur le bouton qui exécute la fonction connexion première fois hooks (état) connecté a la valeur 0 . Je souhaite qu'il ait la valeur 1

const [logged, setLogged] = React.useState(0);
const login = () => {
   if (tempLogin.login === "Login" && tempLogin.password == "Haslo") {
    setLogged(logged => logged + 1);
     console.log(logged);
  }

reactjs

0 commentaires

3 Réponses :

2
votes

Vous le mettez à jour correctement! En vous connectant simplement au mauvais endroit, rappelez-vous, les valeurs des hooks sont mises à jour lors du rendu suivant et vous appelez console.log dans login au moment où la connexion est exécutée, connecté n'est pas encore mis à jour

const Component = () =>{

    const [logged, setLogged] = React.useState(0);

    const login = () => {
         if (tempLogin.login === "Login" && tempLogin.password == "Haslo") {
             setLogged(logged => logged + 1);
     }
     //Component's body
     console.log(logged)  // 0, 1
     return <div>{logged}</div>
 }

2 commentaires

Je n'ai aucune idée de l'endroit où je devrais vérifier la valeur enregistrée

J'ai mis à jour avec un exemple

0
votes

Cela peut aider:

const [logged, setLogged] = React.useState(0); const login = () => {   
if (tempLogin.login === "Login" && tempLogin.password == "Haslo") {
           setLogged(logged + 1);
           console.log(logged);  
     }

0 commentaires

0
votes

setLogged est asynchrone et ne met pas à jour l'état immédiatement, mais vous verrez l'état mis à jour dans le prochain rendu.

Vous pouvez utiliser useEffect (qui indique à React que votre composant doit faire quelque chose après le rendu) pour voir la nouvelle valeur de logged:

const [logged, setLogged] = React.useState(0);
const login = () => {
  if (tempLogin.login === "Login" && tempLogin.password == "Haslo") {
    setLogged(logged => logged + 1);
    console.log(logged);
  }
}

useEffect(() => {
  console.log(logged);
}, [logged])

0 commentaires