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

hal*_*y9k 7 javascript redux

在关于Reducers的Redux基础知识教程部分中,我无法理解以下语法如何推断应用状态的哪个子集传递给在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
Run Code Online (Sandbox Code Playgroud)

Sha*_*ere 5

关于您关于该combineReducers函数如何工作的具体问题,请查看源代码。您可以在redux 存储库中的combineReducers.js 中看到,当操作通过每个已组合的减速器时,每个单独的减速器都会传递与您传递给的对象中的相应键匹配的状态分支combineReducers

因此,在您的示例中, thevisibilityFiltertodosreducer 都具有相同名称的键(因为您使用的是ES6 对象属性速记)。这些键用于将特定的状态分支传递给每个相应的减速器。