如何与新数据进行con反应先前的数据

Question

我有一个挂钩，如果向下滚动它会像无限滚动一样要求新数据，但是当我向下滚动时，它将其调用API以获取新数据，但它正在删除先前的数据。我想使用以前的数据。我认为通过选择React查询的选择方法可能是可能的，但是如何获取先前的数据

const useActivityFeedData = (
  activityFeedPageIndex: number,
  pageSize = Config.defaultPageSize,
) =>
  useQuery(
    [ACTIVITY_FEED, activityFeedPageIndex],
    () => Api.user.getActivityFeedData(activityFeedPageIndex, pageSize),
    {
      initialData: {
        activityList: [],
      },
      keepPreviousData: true,
      select: (res: any) => ({
        activityList: res.activityList,
      }),
    },
  );

Answer 1

您真的在寻找 infinite查询 - - useinfinitequery是为此精确用例制作的。

Answer 2

为什么不这样的东西：

const useActivityFeedData = (
  activityFeedPageIndex: number,
  pageSize = Config.defaultPageSize,
) =>
  const prevData = queryClient.getQueryData([ACTIVITY_FEED,activityFeedPageIndex]).
  useQuery(
    [ACTIVITY_FEED, activityFeedPageIndex],
    () => Api.user.getActivityFeedData(activityFeedPageIndex, pageSize),
    {
      initialData: {
        activityList: [],
      },
      keepPreviousData: true,
      select: (res: any) => ({
        activityList: res.activityList,
      }),
    },
  );

然后只需将prevdata返回您的reversnse或将响应分配给使用usequery的变量，然后将其返回。

Answer 3

只需在类似的组件安装上创建一个数组，

 let [data, setData] = useState([])
useEffect(()=>{
       
    },[])

立即将AXIOS换成相同的使用效果

useEffect(()=>{
       let data = []
axios.get(`....`).then(res=>{
setData(res.data)
})
    },[])

现在在获取新数据时滚动后，

eg: axios.get(`...`).then(res=>{
let var = data.concat(res.data)
setData(var)
})

，只需将其cont到以前的数组中即可。然后，当u映射数据时，它会在更新页面时继续滚动。

希望这会有所帮助：）