问题描述
我有一个名为 api-hooks
的文件,其中有一个函数..
我正在使用 @apollo/client
的 useLazyQuery
。
export function useLazyProposalList() {
const [getQueueData,{ loading,data,error,fetchMore }] = useLazyQuery(PROPOSAL_LIST,{
fetchPolicy: 'no-cache',});
const proposalList = React.useMemo(() => {
if (!data) {
return null;
}
return transformProposals(data);
},[data]);
return {
getQueueData,fetchMore,loading,data: proposalList,};
}
在我的组件中,我是这样使用的:
const { getQueueData,data: queueData,fetchMore: fetchMoreProposals } = useLazyProposalList();
现在,如果用户点击 load more
按钮,我会调用 fetchMoreProposals
函数,该函数从 fetchMore
返回为 useLazyQuery
。
现在,问题是当调用这个时,我必须再次在我的 COMPONENT 中调用 transformProposals
来获取返回的数据,这让我很恼火。最好只在 transformProposals
中有 useLazyProposalList
.. 这可能还是没有办法做到这一点?
一种方法如下:
export function useLazyProposalList() {
const [getQueueData,});
const fetchMoreProposals = React.useCallback(
async (options) => {
if (fetchMore) {
const { data,error } = await fetchMore(options);
return {
data: transformProposals(data),};
}
return {
data: {},};
},[fetchMore],);
const proposalList = React.useMemo(() => {
if (!data) {
return null;
}
return transformProposals(data);
},fetchMore: fetchMoreProposals,};
}
但我不喜欢这个。
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)