Reactjs 屏幕不显示'；t当它返回视图时重新加载（axios retrigger）

在我的屏幕中，我通过Axios（使用Axios挂钩）加载组列表。然而，当我稍后回到屏幕时，我观察到数据没有重新加载（并且错过了来自服务器的新数据）

我假设这是由于组件的生命周期造成的，但我尝试了不同的方法，无法在每次用户看到屏幕时强制useAxios触发

我的简单屏幕如下：

import * as React from "react";
import useAxios from "axios-hooks";

import { Button, View, Text, TextField } from "react-native-ui-lib";

export default function GroupListScreen({ navigation }: any) {
  const [{ data: groups, loading, error }, refetch] = useAxios(
    "/group_members/"
  );

  if (error) return <Text>Error...</Text>;
  if (loading) return <Text>Loading...</Text>;

  const list = () => {
    return groups.map((group: any) => {
      return (
        <View key={group.id}>
          <Button
            margin-5
            label={group.group.name}
            enableShadow
            onPress={() =>
              navigation.push("Group Overview", { id: group.group.id })
            }
          />
        </View>
      );
    });
  };

  return (
    <View flex top padding-20 marginT-40>
      <Button
        margin-5
        label="Back"
        enableShadow
        onPress={() => navigation.pop()}
      />
      <Button
        margin-5
        label="Refetch"
        enableShadow
        onPress={() => refetch()}
        disabled={loading}
      />
      {list()}
    </View>
  );
}

import*as React from“React”；
从“axios挂钩”导入useAxios；
从“react native ui lib”导入{按钮、视图、文本、文本字段}；
导出默认函数GroupListScreen（{navigation}:any）{
常量[{data:groups，loading，error}，refetch]=useAxios(
“/组成员/”
);
如果（错误）返回错误。。。；
如果（装载）返回装载。。。；
常量列表=（）=>{
返回组.map（（组：任意）=>{
返回(
push（“组概览”，{id:Group.Group.id}）
}
/>
);
});
};
返回(
navigation.pop（）}
/>
refetch（）}
已禁用={loading}
/>
{list（）}
);
}

---

有什么想法吗？

我相信没有任何依赖关系的

useffect（（）=>refetch（））

应该在这个案例中可行，并在内部调用

refetch（）

。将其设置为

componentDidMount（）

。您还可以使用自定义状态跳过第一次。我假设您是在第一次渲染后导航回路由时谈论的。然后，您应该使用传入数据检查当前组数据，以确定useEffect挂钩内的refetch（）行为。如果它们相同，则停止调用refetch（），如果不同，则直接返回并设置新数据。只需创建一个本地副本，基于本地副本进行渲染，这样就不会陷入无限循环。我怀疑axioshook没有解决这个问题的快捷功能。这似乎是一个普遍的问题。