要跳过 Apollo 缓存并使用 useLazyQuery
进行查询,可以使用 fetchPolicy
参数来控制缓存行为。将 fetchPolicy
设置为 "network-only"
可以跳过缓存并强制从网络获取最新数据。
以下是一个示例代码:
import { useLazyQuery } from '@apollo/client';
import { gql } from 'apollo-boost';
const GET_DATA = gql`
query GetData {
// your query here
}
`;
const MyComponent = () => {
const [getData, { loading, data }] = useLazyQuery(GET_DATA, {
fetchPolicy: 'network-only',
});
// 调用查询
const handleFetchData = () => {
getData();
};
if (loading) {
return Loading...;
}
if (data) {
// 处理返回的数据
return {/* render data */};
}
return (
);
};
在上面的示例中,useLazyQuery
接受一个 fetchPolicy
参数,将其设置为 "network-only"
以跳过缓存。当调用 getData
函数时,将发送一个新的网络请求,而不是从缓存中获取数据。
请注意,如果您希望在组件挂载时立即发送查询,并且不希望使用缓存,可以将 useLazyQuery
的第二个返回值 { loading, data }
进行解构。loading
变量将指示查询是否正在进行中,而 data
变量将包含查询的结果数据。