即使在设置全局状态以防止它之后，函数也会被调用答案

【问题标题】：Function gets called even after setting global state to prevent it即使在设置全局状态以防止它之后，函数也会被调用
【发布时间】：2022-09-30 20:01:33
【问题描述】：

在反应功能组件中 -
useEffect(() => {
    if (!referralUserSaved && referralCode && !Object.keys(user).length) {
      if (referralCode.trim().length == 4) {
        saveReferralsInstalls();
      }
    }
  }, [deviceInfo, referralCode, broadcastSubscribed, androidId, ipAddress]);
保存全局状态以防止重复调用的 API 调用
Api.post(`/tableName`, params).send((res) => {
    if (res.type !== \"error\") {
      setState({ referralUserSaved: true });
    }
  });
我了解 useffect 中的多个参数会导致它运行多次，但即使在 if 条件之后，为什么调用 api 方法并且重复数据被存储 2-3 次？ if(!referralUserSaved) 部分应该防止重复调用

标签： javascript reactjs react-native

【解决方案1】：

您的参数可能在异步函数响应之前重新加载。

删除无用的参数或使用状态保护来防止重复重新加载。

const [fetching, setFetching] = useState(false);

const saveReferralsInstalls = async () => {
  setFetching(true);
  // Your code
}

useEffect(() => {
  if (!fetching && !referralUserSaved && referralCode && !Object.keys(user).length) {
    if (referralCode.trim().length == 4) {
      saveReferralsInstalls().then(() => setFetching(false));
    }
  }
}, [deviceInfo, referralCode, broadcastSubscribed, androidId, ipAddress]);

【讨论】：