createSelector returns 一个函数而不是选择状态

Question

我尝试使用 @redux/toolkit 中的 createSelector 来记住该州某些项目的计算结果，但我没有获得任何数据 - 甚至没有未定义或空数组 - 因为一个输出。

在我的组件中

// 从'@reduxjs/toolkit'导入{createSelector};

  const stateInstitutions = (state) => state.institutions.items;
  const ins = useSelector(stateInstitutions);
  const institutionsOptions = createSelector(
    stateInstitutions,
    // this is what I want to do
    // (institutions) => institutions.map(({ name }) => ({ label: name, value: name })), 
    (institutions) => institutions, // just for testing
  );
  console.log(ins, institutionsOptions);

日志输出为

(13) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] ƒ memoized() {
    var value = cache.get(arguments);

    if (value === NOT_FOUND) {
      // @ts-ignore
      value = func.apply(null, arguments);

      if (resultEqualityCheck) {
        var entries…

如您所见，我指向了正确的选择器，因为我从 useSelector 而不是 createSelector.

获取数据

我肯定犯了一些愚蠢的错误，但我不确定是什么。

Answer 1

问题是 createSelector returns 一个选择器。您仍然需要将您的状态传递给选择器。

例如

const stateInstitutions = (state) => state.institutions.items;
const ins = useSelector(stateInstitutions);
const institutionOptionSelector = createSelector(
    stateInstitutions,
    (institutions) => institutions.map(({ name }) => ({ label: name, value: name })), 
  );
const instOptions = useSelector(institutionOptionSelector);
console.log(ins, institutionsOptions);

createSelector returns 一个函数而不是选择状态

createSelector returns a function and not the selected state

react-redux

redux-toolkit