使用UseEffect fetchBusinesses调用UseEffect()中的function declare，在调用函数名后声明一个const变量，

useEffect(()=>{
const fetchBusinesses=()=>{
   console.log(useeffect fetchbussinesses functions)
}
 fetchBusinesses();
},[declare the variable used in useeffect hooks ])

下一行禁用ESLint即可;

useEffect(() => {
   fetchBusinesses();
// eslint-disable-next-line
}, []);

通过这种方式，您使用它就像使用组件挂载(调用一次)一样。

更新

or

const fetchBusinesses = useCallback(() => {
 // Your logic in here
 }, [someDeps])

useEffect(() => {
   fetchBusinesses();
// No need to skip the ESLint warning
}, [fetchBusinesses]);

fetchBusinesses将在每次someDeps更改时被调用。

你可以通过传递一个引用来消除这个Es-lint警告:

下面提到的例子，但是你可以在这个链接上观看解决方案:https://www.youtube.com/watch?v=r4A46oBIwZk&t=8s

警告: 第13:8行:反应。useEffect缺少依赖项:'history'和'currentUser?.role'。要么包含它们，要么删除依赖数组react-hooks/ exhaustion -deps

React.useEffect(() => {
    if (currentUser?.role !== "Student") {
        return history.push("/")
    }
}, [])

解决方法: 步骤1:将业务逻辑移到单独的const中。

现在的警告是:React Hook React。useEffect有一个缺失的依赖:' rolecheck '。

const roleChecking = () =>{
   if (currentUser?.role !== "Student") {
        return history.push("/")
    }
}

React.useEffect(() => {
    roleChecking()
}, [])

最后一步是创建对函数的引用:

  const roleRef = React.useRef();

  const roleChecking = () => {
    if (currentUser?.role !== "Student") {
      return history.push("/");
    }
  };
  roleRef.current = roleChecking;

  React.useEffect(() => {
   return roleRef.current();
  }, [currentUser?.role]);

你正在使用useEffect，当你这样做的时候，你经常会想要使用一些变量作为你的组件中的道具或状态。

eslint中有一个规则，它希望你引用useEffect依赖数组中任何不同的道具或状态块。这是控制何时执行useEffect的数组。该规则希望看到它列在数组中，数组决定何时重新运行useEffect函数。

因此，您需要添加[fetchBusinesses]，这样警告就会消失。

为什么这个规则要我们把它写在这里?

在某些情况下，使用useEffect而没有正确列出数组内的所有状态和道具，可能会导致奇怪且难以调试的问题。

因此，这条规则有助于避免使用useEffect可能出现的那些难以理解的问题。

现在，任意添加到该数组也会导致错误。所以无论哪种方式，你都遇到了必须解决的bug。根据你的评论，似乎为你解决了这个问题，但我想进一步调查，看看你是否有机会在你的网络选项卡在Chrome中添加fetchBusinesses函数到你的useEffect数组后得到第二个GET请求。

好吧，如果你想从不同的角度来看这个问题，你只需要知道React有哪些非耗尽的选项。你不应该在效果中使用闭包函数的原因之一是在每次渲染时，它都会被重新创建/销毁。

因此，钩子中有多个React方法被认为是稳定的和非耗尽的，在这些方法中，您不必应用到useEffect依赖项，并且反过来也不会破坏React -hooks/竭-deps的约定规则。例如，useReducer或useState的第二个返回变量是一个函数。

const [,dispatch] = useReducer(reducer, {});

useEffect(() => {
    dispatch(); // Non-exhausted - ESLint won't nag about this
}, []);

所以反过来，你可以让所有的外部依赖关系与你在reducer函数中的当前依赖关系共存。

const [,dispatch] = useReducer((current, update) => {
    const { foobar } = update;
    // Logic

    return { ...current, ...update };
}), {});

const [foobar, setFoobar] = useState(false);

useEffect(() => {
    dispatch({ foobar }); // non-exhausted `dispatch` function
}, [foobar]);

在项目中禁用此警告

将这个"react-hooks/ exhaustion -deps": "off"添加到.eslintrc.js文件中