javascript—在react和redux中的下一个操作中使用以前调度的操作中的值

guykilcj  于 2021-09-23  发布在  Java
关注(0)|答案(2)|浏览(180)

我正在使用 react-redux 而且 redux-thunk 我有两个动作,其中一个动作依赖于另一个动作的结果来执行自己的动作。下面是我的代码的外观;

const file = useSelector(state => state.Files.file)
const handleActions = async () =>{
  try{
      await dispatch(uploadFile(dataForm))
      await dispatch(updateBusiness(params))
  }
  catch(e){
      console.log(e)
  }

}

所以,我需要在的响应数据中有一个值 uploadFile() 表演 updateBusiness() 我试着用 file 刚好在…之后 uploadFile() 但我正在变得不明确。

const file = useSelector(state => state.Files.file)
 const handleActions = async () =>{
   try{
       await dispatch(uploadFile(dataForm))
       params.file = file
       await dispatch(updateBusiness(params))
   }
   catch(e){
       console.log(e)
   }

 }

我怎样才能解决这个问题?

u91tlkcl

u91tlkcl1#

你可以 useEffect 检查何时 file 更新

useEfect(() => {
  if(file){
    params.file = file
    dispatch(updateBusiness(params))
  }
}, [file])
qybjjes1

qybjjes12#

由于分派是异步的,因此需要等待状态更改。尝试将updatebusiness函数移到具有文件依赖关系的useeffect中。

const file = useSelector(state => state.Files.file)

 // updateBusinessFunction
 useEffect(()=>{
   const update = async () => {
      try {
         const data = params;  //copy value of params
         data.file = file;
         await dispatch(updateBusiness(data));
      } catch (e) {
         console.log('update business error : ', e)
      }
   }
 },[file]) // if params is not constant change it to [file,params]

 const handleActions = async () =>{
   try{
       await dispatch(uploadFile(dataForm))
   }
   catch(e){
       console.log(e)
   }
 }

那样 updateBusiness 将使用run when file 状态改变了。

相关问题