React Hook useCallback 有一个不必要的依赖：'GqlUserResponse'

Question

嘿，我在这段代码中遇到错误

interface GqlUserResponse {
    data: {
      listUsers: {
        items: UserType[]
      }
    },
    errors?: any[]
  }

  useEffect(() => {
    onAuthUIStateChange((
      nextAuthState: any,
      authData: any,
    ) => {
      setAuthState(nextAuthState);
      if (authState !== AuthState.SignedOut) {
        console.log('authData', authData);
        setEmail(authData.attributes.email);
      }
    });
  },
  [authState]);

  const fetchUser = useCallback(async () => {
    try {
      const filter = {
        email: {
          eq: email, // filter priority = 1
        },
      };
      const result = await API.graphql(
        graphqlOperation(listUsers, { filter }),
      ) as GqlUserResponse;
      console.log('result', result?.data?.listUsers.items[0]);
      // setUser(result?.data?.listUsers?.items[0]);
    } catch (res) {
      // eslint-disable-next-line no-console
      console.error('error fetching userFiles', res);
    }
  }, [GqlUserResponse, email]);

  useEffect(() => {
    fetchUser();
  }, [fetchUser]);

错误：第 78:6 行：React Hook useCallback 有一个不必要的依赖项：'GqlUserResponse'。 排除它或删除依赖数组。 像“GqlUserResponse”这样的外部 scope 值不是有效的依赖项，因为改变它们不会重新渲染组件 react-hooks/exhaustive-deps 任何困难

Answer 1

错误消息非常清晰且很有帮助。 从GqlUserResponse的依赖数组中useCallback 。

依赖数组用于定义useCallback （或类似的useMemo ）何时停止使用其记忆值并重新初始化。 正如错误消息所述...改变外部 scope 值（在这种情况下是您的接口本身）不会导致重新渲染，因此它不属于依赖项数组。