微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

我可以记住自定义钩子,这是反应中的 graphql 查询吗?

如何解决我可以记住自定义钩子,这是反应中的 graphql 查询吗?

// useMe.tsx //
import { gql,useQuery } from "@apollo/client";
import { meQuery } from "../__generated__/meQuery";

export const ME_QUERY = gql`
  query meQuery {
    me {
      id
      email
      my_workspaces {
        title
      }
    }
  }
`;

export const useMe = () => {
  return useQuery<meQuery>(ME_QUERY,{
    fetchPolicy: "cache-first"
  });

};

这是我的自定义钩子。我正在尝试使用 graphql 查询获取用户信息并将其设置为自定义挂钩。

但是出现了一些问题,每当高级组件状态发生变化时,

调用 custom-hook(useMe) 的低级组件总是重新渲染

所以我想用 useCallback 或 useMemo 记住自定义钩子,但我找不到正确的答案

请帮帮我,谢谢

解决方法

useCallback 包裹就可以了

const useMeQuery = () => {
  return useQuery<meQuery>(ME_QUERY,{
    fetchPolicy: "cache-first"
  });
export const useMe = useCallbak(useMeQuery)
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。