State Not Updating Immediately

[CGeekDylan]

When updating state using useState, the change doesn't reflect immediately in the next line of code.

import { useState } from "react";

function Counter() {
const [count, setCount] = useState(0);

const increment = () => {
setCount(count + 1);
console.log(count); // Logs old value instead of updated value
};

return (

Count: {count}

Increase

);
}
export default Counter;

[MK825]

To ensure the correct value, update state based on the previous state:

const increment = () => {
setCount(prevCount => prevCount + 1);
console.log(count); // Still logs old value, but will be correct in next render
};