Apollo-Client 重新获取 - 类型错误:未定义不是对象

Sva*_*rto 5 react-native apollo-client react-native-flatlist

我在反应本机中有一个平面列表,我试图在拉下它时重新获取数据(本机刷新功能)。当我这样做时,我收到此错误:

类型错误:未定义不是对象

我不知道出了什么问题。我在用

  • 世博 SDK 38
  • "@apollo/client": "^3.1.3",
  • "graphql": "^15.3.0",

这是我的代码:

export default function DiscoverFeed({ navigation }) {
  const theme = useTheme();

  const { data, error, loading, refetch, fetchMore, networkStatus } = useQuery(
    GET_RECIPE_FEED,
    {
      variables: { offset: 0 },
      notifyOnNetworkStatusChange: true,
    }
  );

  if (error) return <Text>There was an error, try and reload.</Text>;
  if (loading) return <Loader />;
  if (networkStatus === NetworkStatus.refetch) return <Loader />;

  const renderItem = ({ item }) => {
    return (
      <View style={styles.cardItems}>
        <RecipeCard item={item} navigation={navigation} />
      </View>
    );
  };

  return (
    <SafeAreaView style={styles.safeContainer} edges={["right", "left"]}>
      <FlatList
        style={styles.flatContainer}
        data={data.recipe}
        removeClippedSubviews={true}
        renderItem={renderItem}
        refreshing={loading}
        onRefresh={() => {
          refetch();
        }}
        keyExtractor={(item) => item.id.toString()}
        onEndReachedThreshold={0.5}
        onEndReached={() => {
          // The fetchMore method is used to load new data and add it
          // to the original query we used to populate the list
          fetchMore({
            variables: {
              offset: data.recipe.length,
            },
          });
        }}
      />
    </SafeAreaView>
  );
}
Run Code Online (Sandbox Code Playgroud)

我有一个像这样的类型策略:

export const cache = new InMemoryCache({
  typePolicies: {
    Query: {
      fields: {
        recipe: {
          merge: (existing = [], incoming, { args }) => {
            // On initial load or when adding a recipe, offset is 0 and only take the incoming data to avoid duplication
            if (args.offset == 0) {
              console.log("offset 0 incoming", incoming);
              return [...incoming];
            }
            console.log("existing", existing);
            console.log("incoming", incoming);
            // This is only for pagination
            return [...existing, ...incoming];
          },
        },
      },
    },
  },
});
Run Code Online (Sandbox Code Playgroud)

这是获取数据的查询:

export const GET_RECIPE_FEED = gql`
  query GetRecipeFeed($offset: Int) {
    recipe(order_by: { updated_at: desc }, limit: 5, offset: $offset)
      @connection(key: "recipe") {
      id
      title
      description
      images_json
      updated_at
      dishtype
      difficulty
      duration
      recipe_tags {
        tag {
          tag
        }
      }
    }
  }
`;
Run Code Online (Sandbox Code Playgroud)