我只想在离开页面时将 React 本地状态保存到 redux [重复]答案

【问题标题】：I'd like to save the React local state to redux only when leaving the page [duplicate]我只想在离开页面时将 React 本地状态保存到 redux [重复]
【发布时间】：2021-05-11 11:25:38
【问题描述】：

我正在使用本地反应 useState 来更新我的输入。我尝试使用 useEffect hook 的 clenaup 函数将状态保存到 Redux。

useEffect(() => {
    return function saveDetails() {
      dispatch(
        saveSiteDetails({ siteDetails, contactsToAdd, emailsToAdd, team })
      );
    };
  }, [dispatch, siteDetails, contactsToAdd, emailsToAdd, team]);

但是每次我更改输入时，redux 状态都会更新。如何实现只有当用户通过点击当前页面中的一些链接离开当前页面时redux状态才更新的功能？

【问题讨论】：

您可以在链接的onClick 属性中使用的回调函数中使用dispatch 函数。
问题是，这些链接位于另一个组件内。该组件位于当前页面内。我一直在想，要不要做道具钻来传回调？
这能回答你的问题吗？ stackoverflow.com/questions/60734531/…
@KM 您能否介绍组件之间的关系？

标签： reactjs react-redux

【解决方案1】：

玩了一会儿，我想你可以这样做：

  const _saveSiteDetails = useRef(() => {});

  _saveSiteDetails.current = () => {
    dispatch(
      saveSiteDetails({ siteDetails, contactsToAdd, emailsToAdd, team })
    );
  };

  const cleanUp = () => _saveSiteDetails.current();

  useEffect(() => cleanUp, []);

【讨论】：