使用查询数据和错误返回未定义但网络选项卡显示数据

Question

嗨，我在尝试使用 urql 的 useQuery 获取数据时遇到问题。每当我尝试 console.log() 数据时，它都会显示未定义，但是当我查看网络选项卡时，我可以看到数据。这只发生在 useQuery 突变确实按预期工作的情况下。

这是我的代码：

const { executeQuery: getAddressDetails } = useQuery<AddressDetailsResponse>({
  query: ADDRESS_DETAILS_QUERY,
  pause: true,
  variables: {
    input: {
      context,
      session
    }
  },
  requestPolicy: 'network-only',
});

const fetchAddressDetails = async () => {
    const { data }  = await getAddressDetails();

    console.log(data.value);
    // shows undefined
};

我还将结果记录在urql的mapExchange内的onResults中，如下所示：

const client = createClient({
  url: import.meta.env.VITE_GRAPHQL_URL ?? '',
  exchanges: [
    mapExchange({
      onResult(result) {
        console.log(result);
      }
    }),
    fetchExchange,
  ],
  fetchOptions: {
    headers: fetchHeaders()
  }
});

在这里我确实看到了数据，所以我怀疑缓存出了问题，我试图通过在交换中添加

cacheExchange({})

来修复它。但这似乎没有任何效果。

Answer 1

在浏览器中查找 urql 缓存警告。您可能需要查询实体上的

id

属性，特别是当从应用程序的其他部分查询相同的类型时。