useEffect 中的异步函数获取旧道具答案

【问题标题】：async function in useeffect get old propuseEffect 中的异步函数获取旧道具
【发布时间】：2019-07-18 07:57:45
【问题描述】：

我有一些类似的代码：

let props.n default =1

    function consoleLog()
    {
        dispatch({n:2});
            useEffect(()=>
            {
                   async function c()
                   {
                     await new Promise((resolve,reject)=>setTimeout(() =>resolve(), 1500));
                     console.log(props.n);
                   }
                   c();
            },[]);
        return(null);
    }

我得到的结果是 1 ，但不是 2 ，如何使用新道具而不使用旧道具？

【问题讨论】：

你需要添加n作为依赖。不要将[] 作为useEffect 中的第二个参数，而是尝试设置[props.n]。这样，useEffect 将在 n 更新时运行。使用[]，isEffect 只会在组件挂载时运行一次。

标签： reactjs react-redux react-hooks

【解决方案1】：

好的，这确实很棘手，但您可以使用useRef 在那里放置一些道具

function A(props) {
  const storage = useRef();
  storage.current = props.some;
  useEffect(()=>  {
    async function c() {
      await new Promise((resolve,reject)=>setTimeout(() =>resolve(), 1500));
      console.log(storage.current.some);
    }
    c();
  },[]);
}

因为props 只是一个变量，某些函数在运行中延迟，它可以访问第一个版本的数据，但无法访问下一个版本。

但我相信这可能是实现您最终目标的更合适的方式。

【讨论】：