Reactjs react组件卸载时是否可以分派功能？（反应功能复合物）

嗨，我正在制作一些函数，调用api并将该值保存在状态中，然后在用户离开组件时进行调度。所以我尝试使用react-useEffect钩子作为组件来卸载和分派一些带有参数作为状态值的操作。 但问题是分派操作是工作的，但字符串为空。。我认为状态值被删除了，然后分派函数被执行。那么，当用户离开组件时，有没有办法用状态值调用函数呢

const [userCheck,setUserCheck]=React.useState('')

useEffect(() => {
  
  const fetChItem='this is the function which calling api '
    setUserCheck(fetChItem);

}, []);

useEffect(() => {
  return () => {
    dispatch(saveFetchValue(userCheck));
    
  };
}, []);

问题 这将不起作用，因为附件如何与

useffect

回调一起工作。有以下几点

useEffect(() => {
  return () => {
    dispatch(saveFetchValue(userCheck));
  };
}, []);

您已将初始的

userCheck

状态值（

“

）包含在返回的清除函数中

解决方案 使用react ref和第二个

useffect

hook“缓存”最新状态

const [userCheck, setUserCheck] = React.useState('');

const userCheckRef = React.useRef(userCheck); // ref to store state value

React.useEffect(() => {
  userCheckRef.current = userCheck; // save userCheck state value to ref
}, [userCheck]);

...

useEffect(() => {
  return () => {
    dispatch(saveFetchValue(userCheckRef.current)); // pass current ref value
  };
}, []);

演示