Redux Toolkit 查询轮询导致每次提取都重新呈现答案

【问题标题】：Redux Toolkit Query polling is causing re-renders for each fetchingRedux Toolkit 查询轮询导致每次提取都重新呈现
【发布时间】：2023-02-21 16:31:27
【问题描述】：

数据没有改变，但组件的重新渲染在每次获取时发生。我做了一些研究，发现了关于 selectFromResult 属性的信息，只访问数据本身而不是 isFetching prop 或其他

这是我来自 apiSlice 的查询：

getNotification: builder.query<GetNotificationsResponse, GetNotificationsRequest>({
      query: ({ page, limit }) => ({
        url: `notifications?page=${page}&limit=${limit}`,
        method: 'GET',
      }),
    }),

这是我如何使用轮询和 selectFromResult

  const result = useGetNotificationQuery(
    {
      page: 1,
      limit: 10,
    },
    {
      pollingInterval: 1000,
      selectFromResult: data => data.data,
    },
  );

【问题讨论】：

const {data, isLoading, isError, error} = useGetNotificationQuery(..
是更通用的方法，不确定您是否想要 isFetching，isLoading 仅在没有数据时才会触发，isFetching 会在每次轮询时触发

标签： reactjs redux react-redux redux-toolkit

【解决方案1】：

请注意，对 selectFromResult 的整体返回值执行浅层相等检查，以确定是否强制重新渲染。即，如果任何返回的对象值更改引用，它将触发重新渲染。如果创建新的数组/对象并将其用作回调中的返回值，由于每次运行回调时都被识别为新项目，这将阻碍性能优势。当有意提供一个空数组/对象时，为了避免每次回调运行时都重新创建它，您可以在组件外部声明一个空数组/对象以保持稳定的引用。

我认为这个link 会帮助你。

为了避免不必要的重新渲染，我们需要确保我们提取的任何数据都被正确地记忆了。为此，我们应该创建一个新的选择器实例，组件可以在每次渲染时重用该实例，以便选择器记住结果。

【讨论】：

在这里，他们使用 selectFromResult 的方式略有不同（我猜应该是实际使用的方式）——选择从查询返回的数据部分。
我想要的是避免在数据未更改时重新呈现，我从后面获取通知数组，我应该不断轮询它以查看是否有新通知，但如果数据不存在，我不想重新呈现变了。
我用示例代码示例更新了链接