不明白为什么我不能访问计数器的值

Question

Why does the conditional statement inside handleDecrement if(counter>1) not work?

const [counter, setCounter] = React.useState(1);

function handleIncrement (counter){
  setCounter(counter => counter + 1)
}
function handleDecrement (counter){
  if(counter>1){
    setCounter(counter => counter - 1)
  }
}

Answer 1

You're not calling these function inside setCounter , you're just passing arrow function definitions and not the calculated value of the counter, so then inside the if statement, you're comparing not the integer with integer, but a function definition with an integer.

Fixed code:

 const [counter, setCounter] = React.useState(1); function handleIncrement(counterArg) { setCounter(counterArg + 1) } function handleDecrement(counterArg) { if (counterArg > 1) { setCounter(counterArg - 1) } }

And then attaching it to onClick event:

 <Button onClick={() => handleIncrement(counter)}> <Button onClick={() => handleDecrement(counter)}>