Question

我在我的反应应用程序中使用redux和选择器中长时间运行的计算，所以我想在它工作时显示加载指示器。以下是选择器的示例代码：

const getItems = state => state.items;
const getFilters = state => state.filters;

export const getFilteredItems = createSelector([getItems, getFilters], 
(items, filters) => {
  //some long running filtering
  return filteredItems;
});

所以问题是在这种情况下显示加载指标的最常用方法是什么？

Answer 1

我会有一个标志，通过componentDidMount的动作进行变异，所以我第一次不显示内容而只是显示加载状态。然后选择器将是这样的：

const getItems = state => state.items;
const getFilters = state => state.filters;
const getPreLoading = state => state.preLoading;

export const getFilteredItems = createSelector([getPreLoading, getItems, getFilters], 
(preLoading, items, filters) => {
  if (preLoading) return null;

  //some long running filtering
  return filteredItems;
});

重新选择选择器计算时显示加载

1 个答案: