react中的useState与setState的异步问题

useState

用 函数式的 setState 结合展开运算符 来达到合并更新对象的效果

const [count, setCount] = useState({ a: 1 });
setCount((prevState) => {
    return { ...prevState, ...{ b: 2, c: 3 } };
});

使用 useEffect 解决

const [hoverId, setHoverId] = useState('');
setHoverId(e.target.innerText);
useEffect(
    () => {
      console.log(hoverId); // 这里是监控到的最新值
    },
    [hoverId]
  );

setState

使用 回调函数 解决

this.setState(
  { hoverId: e.target.innerText }, () => {
    console.log(this.state.hoverId); // 这里是监控到的最新值
  }
);