react-redux的一个问题

Question

const mapStateToProps = (state) => ({
  todos: getVisibleTodos(state.todos, state.visibilityFilter)
})

官方案例TODOS中 state.todos state.visibilityFilter是怎么来的？

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

export default visibilityFilter

是reducer里的这个方法吗

const todoApp = combineReducers({
  todos,
  visibilityFilter
})

然后state.visibilityFilter可以直接取到state值show_all?

Answer 1

combineReducers 将所有的 reducer 放到一个对象里面。当 state 发送变化时，遍历 reducer 对象，
再根据 reducer 的 key 取出 state 里面的一部分处理。

// 假设有这么一个 reducer 对象
reducers = {
  reducer1: function(state, action) {
    // ...
  },
  reducer2: function(state, action) {
    // ...
  },
}
// 那 state 里面也有同名的 value
state = {
  reducer1 : 'value1',
  reducer2 : 'value2'
}

可以看看这个源码解析的 combineReducers 部分

Answer 2

combineReducers指定了visibilityFilter这个reducer只会接收到整个state对象中的state.visibilityFilter部分。

visibilityFilter第一次触发的时候判断如果state.visibilityFilter是undefined, 就会把SHOW_ALL作为初始值。