State - Kevin Powell - Community

Kevin Powell - Community•17mo ago

State

why does the alert does not get the latest value while the 2nd setter function does?

import { useState } from 'react';

export default function Counter() {
  const [number, setNumber] = useState(0);

  return (
    <>
      <h1>{number}</h1>
      <button onClick={() => {
      setNumber(number => number + 5);
      setNumber(number => number + 5);
      alert(number);
      }}>+5</button>
    </>
  )
}

import { useState } from 'react';

export default function Counter() {
  const [number, setNumber] = useState(0);

  return (
    <>
      <h1>{number}</h1>
      <button onClick={() => {
      setNumber(number => number + 5);
      setNumber(number => number + 5);
      alert(number);
      }}>+5</button>
    </>
  )
}