产生问题: 在React的函数组件中使用useState进行数据存储,导致数据异步,不能及时获取当前最新的数据。
原因: 这是因为React里事件分为合成事件和原生事件,合成事件和钩子函数都是异步的,原生事件是同步的。因为useState是异步事件,所以会出现不能及时获取到最新值的情况。
解决方法: 先使用useRef进行存储数据,再使用useEffect监听数据变化,并进行更新。

const [info, setInfo] = useState();

const infoRef = useRef();

useEffect(() => {
    infoRef.current = info;
  }, [info]);

在之后需要使用info数据的地方只需要获取infoRef.current即可获得最新的info数据内容。

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐