时间戳

首页 > 解决方案 > 返回上一个屏幕时执行 useQuery() 挂钩反应原生堆栈导航器

reactjs - 返回上一个屏幕时执行 useQuery() 挂钩反应原生堆栈导航器

问题描述

我知道 React 中的固定规则之一是您不能在功能组件的方法内执行任何钩子，甚至不能在其他钩子（如 useEffect 钩子）内执行任何钩子。它必须在组件本身的主体中执行。

所以今天在开发一个测验应用程序时，我遇到了这样一种情况，在堆栈导航器上通过一个屏幕后，我想通过单击后退按钮再次返回该屏幕。但是这一次，我想使用 Apollo Client 提供的 useQuery 钩子使用来自 graphql 查询的数据来修改上一个屏幕上的信息。

isFocused我可以使用道具上的属性检测上一个屏幕是否是焦点。如果它发生变化，那么我将使用 useQuery 再次获取数据。

我可以这样做：

    React.useEffect(() => {
        //how do I fetch data from here using useQuery if React prohibits me to use useQuery here?
    }, [props.isFocused]);

所以这是我的问题，有没有办法解决这个问题？我会很感激你的回应。

标签： reactjsreact-nativereact-navigation

解决方案

在 reactjs 上发现了一个类似问题的问题，我在其中加载了一个带有数据的页面，然后转到另一个页面以将文档添加到数据库中，然后在完成后返回到原始页面。

更改默认设置fetchPolicy以network-only确保我始终获得最新的可用数据。

const { loading: loadingData, error, data } = useQuery(GetData, {
    fetchPolicy: "network-only"

参考：https ://www.apollographql.com/docs/react/data/queries/#setting-a-fetch-policy

推荐阅读