useState 不会立即更新状态，它会在网页中更新

Question

export default function Test() {
const [steps, setSteps] = useState(0);

function increment() {
setSteps(steps=>steps+2);
console.log(steps)
  if(steps==2)//doesnot go in if
  {

  }
}

return (
<div>
  Today you've taken {steps} steps!
  <br />
  <button onClick={increment}>
    step
  </button>
</div>
);
}

更新状态后，我没有在控制台中获得更新的值，也没有进入 if 语句。我做错了什么，它在网页中正确显示