Question

以下selectManageAdvancedUserFilters选择器会导致我的组件呈现两次，但是如果没有该选择器，它将只呈现一次。

export const selectManageAdvancedUserFilters = typeCode => {
  return createSelector([selectUserFilters(typeCode)], userFilters => {
    const manageAdvancedFilters = userFilters.map((filter, index) => {
      return {
        index: index + 1,
        label: filter.name,
        value: filter.name,
        id: filter.id
      };
    });
    return manageAdvancedFilters;
  });
};

export const selectUserFilters = typeCode => {
  return createSelector([selectAllUserFilters], allUserFilters =>
    allUserFilters.filter(allUserFilter => allUserFilter.type === typeCode)
  );
};

export const selectAllUserFilters = createSelector(
  [selectControls],
  controls => {
    return controls && controls.advancedFilters ? controls.advancedFilters : [];
  }
);


export const selectControls = state => {
  return state.controls.data;
};

这是选择器的用法

const unallocatedFilters = useSelector(
    selectDropdownSuggestionFilters('AF1')
  )

使用此选择器重新呈现的原因是什么？

Answer 1

我认为重新渲染是由动态参数typeCode的实现细节引起的。

请参阅以下链接： https://github.com/reduxjs/reselect/issues/392

组件通过重新选择呈现两次

1 个答案: