Redux-Toolkit-Query：轮询，使用选择器 selectfromReult

Question

我使用下面的 Redux-Toolkit Query (RTKQ) 挂钩从其中一个 API 获取信息，并每 5 秒轮询一次，然后

selectFromResult

获取所需的数据。

const selectorData = useMemo(() => {
  const emptyValue = {},
        nullValue = null;

  return createSelector(
    [
      (data) => data,
      (data, error) => (error ? error.status : -1),
    ],
    (data, status) => {
      if (status >= 400) return emptyValue;
        
      return data ?? nullValue;
    },
  );
}, []);

const { interestedData } = useMyApiQuery(
  args1,
  {
    selectFromResult: ({ data, error }) => {
      interestedData: selectorData(data, error)
    }), 
    pollingInterval: 5000
  }
);
    
// using interestedData to load the data in UI.

使用选择器，使组件不会每5秒重新渲染一次，并在数据有更新或错误时重新渲染。

这是使用选择器的正确方法吗？

Answer 1

这是使用选择器的正确方法吗？

我不相信这是正确的。选择器函数（通常）传递整个状态对象，并选择其特定的状态切片并返回计算值。

这里您只是尝试从返回的查询结果中进行选择，而不是整个 Redux 状态。我认为简单地使用一个函数来完成这项工作就足够了。

请注意，对总体回报执行浅层相等检查

selectFromResult

的值来确定是否强制重新渲染。 即如果有任何返回的对象值，它将触发重新渲染 更改参考。

只要您的

emptyValue

和

nullValue

引用稳定，

selectFromResult

功能就应该与开箱即用的

useSelector

选择器功能类似。

组件外：

const emptyValue = {};
const nullValue = null;

组件内部：

const { interestedData } = useMyApiQuery(
  args1,
  {
    selectFromResult: ({ data, error }) => {
      interestedData: error?.status >== 400
        ? emptyValue
        : data ?? nullValue
    }), 
    pollingInterval: 5000
  }
);