javascript - Redux - combineReducers 如何知道将应用状态的哪个子集传递给 reducer

Question

在Redux basics tutorial关于 Reducers 的部分我不太明白以下语法如何推断出应用程序状态的哪个子集要传递给调用 combineReducers 时引用的每个 reducer。是不是单纯的匹配reducer名字上的状态成员名字？

import { combineReducers } from 'redux'
import { ADD_TODO, COMPLETE_TODO, SET_VISIBILITY_FILTER, VisibilityFilters } from './actions'
const { SHOW_ALL } = VisibilityFilters

function visibilityFilter(state = SHOW_ALL, action) {
  switch (action.type) {
    case SET_VISIBILITY_FILTER:
      return action.filter
    default:
      return state
  }
}

function todos(state = [], action) {
  switch (action.type) {
    case ADD_TODO:
      return [
        ...state,
        {
          text: action.text,
          completed: false
        }
      ]
    case COMPLETE_TODO:
      return state.map((todo, index) => {
        if (index === action.index) {
          return Object.assign({}, todo, {
            completed: true
          })
        }
        return todo
      })
    default:
      return state
  }
}

const todoApp = combineReducers({
  visibilityFilter,
  todos
})

export default todoApp

Answer 1

关于您关于如何使用 combineReducers 函数的具体问题，只需查看源代码即可。你可以在combineReducers.js in the redux repo中看到当操作通过每个组合的 reducer 时，每个单独的 reducer 都会通过与您传递给 combineReducers 的对象中的相应键匹配的状态分支。

因此在您的示例中，visibilityFilter 和 todos reducer 都具有相同名称的键(因为您正在使用 ES6 object property shorthand)。这些键用于将特定的状态分支传递给每个相应的 reducer。