即使使用Hooks刷新ReactJS后也获得最后状态

问题描述

即使刷新页面后，如何获得最新状态？刷新后状态会回到0

const [updateCounter,setUpdateCounter] = useState(0);

async function updateCounter() { 
  setUpdateCounter(updateCounter + 1);
}

<Button onClick={updateCounter()}>Update</Button>

解决方法

updateCounter更改后，将其放入本地存储中：

const [counter,setCounter] = useState(Number(localStorage.counter) || 0);
useEffect(() => {
  localStorage.counter = counter;
},[counter]);

您也不应该同时拥有updateCounter数字（处于状态）和updateCounter函数-使用不同的名称。