将 React Navigation 与 Apollo 的 useQuery 结合使用
Using React Navigation with Apollo's useQuery
我有一个屏幕,可以从 Hasura 获取一些数据。我正在使用这样的东西:
// screen1.js
const {data} = useQuery(MY_QUERY)
在 screen1.js
中,我有一个导航到 screen2.js
的按钮。在 screen2.js
中,我有一些突变会更改 screen1.js
中获取的数据。当我更改此数据并执行突变时,我导航回 screen1.js
。我希望 screen1.js
中的数据相应更新。
我已经尝试了几种类似的解决方案(如 docs 中所建议):
const {data} = useQuery(MY_QUERY, {fetchPolicy: "network-only", pollInterval: 500})
但这不起作用。我无法将我的查询设为订阅,因为我的查询调用了 Hasura 的自定义操作,我相信它们只支持查询和变更。
我认为一个解决方案是当我导航到那里时重新渲染 screen1.js
,但我不知道这是否是最佳解决方案。
尝试将其用作默认选项:
const defaultOptions = {
watchQuery: {
fetchPolicy: 'no-cache',
errorPolicy: 'ignore'
},
query: {
fetchPolicy: 'no-cache',
errorPolicy: 'all'
}
}
它应该用于这样的事情,具体取决于您设置 Apollo 的方式:
this.client = new ApolloClient({
link: concat(authMiddleware, link),
cache: new InMemoryCache(),
defaultOptions
})
我有一个屏幕,可以从 Hasura 获取一些数据。我正在使用这样的东西:
// screen1.js
const {data} = useQuery(MY_QUERY)
在 screen1.js
中,我有一个导航到 screen2.js
的按钮。在 screen2.js
中,我有一些突变会更改 screen1.js
中获取的数据。当我更改此数据并执行突变时,我导航回 screen1.js
。我希望 screen1.js
中的数据相应更新。
我已经尝试了几种类似的解决方案(如 docs 中所建议):
const {data} = useQuery(MY_QUERY, {fetchPolicy: "network-only", pollInterval: 500})
但这不起作用。我无法将我的查询设为订阅,因为我的查询调用了 Hasura 的自定义操作,我相信它们只支持查询和变更。
我认为一个解决方案是当我导航到那里时重新渲染 screen1.js
,但我不知道这是否是最佳解决方案。
尝试将其用作默认选项:
const defaultOptions = {
watchQuery: {
fetchPolicy: 'no-cache',
errorPolicy: 'ignore'
},
query: {
fetchPolicy: 'no-cache',
errorPolicy: 'all'
}
}
它应该用于这样的事情,具体取决于您设置 Apollo 的方式:
this.client = new ApolloClient({
link: concat(authMiddleware, link),
cache: new InMemoryCache(),
defaultOptions
})