每个减速器如何获得自己的状态部分?
How does each reducer get their own part of state?
在获得一些 React 基本概念后,我目前正在学习 Redux,我正在观看 Wes Bost 的 Learn Redux 视频系列,这是一个了不起的资源!
我有下一个问题,在该教程中我们有一家商店:
- 帖子
- 评论
评论
假设商店的每个 "part" 都应该有一个 "reducer",所以我们还有 "comments" 和 "posts" reducer,它们在 index reducer 中合并结合减速器。到目前为止一切正常,但我的问题来了:
假设我有 Comments reducer,它接收状态和操作,但它们的状态与 state.comments 匹配。 Posts 减速器也是如此,状态形状如何与状态的特定部分相匹配?
这是来自 Redux 文档:
Note that each of these reducers is managing its own part of the global state. The state parameter is different for every reducer, and corresponds to the part of the state it manages.
这是 Redux 设计的一部分。减速器管理自己的状态。根减速器结合了各个减速器的状态。 Redux 中只有一个商店具有组合状态。
减速器基于 action.type
运行。根据 type
你改变部分状态。他们不会自动知道。例如:
function todoApp(state = initialState, action) {
switch (action.type) {
case SET_VISIBILITY_FILTER:
return Object.assign({}, state, {
visibilityFilter: action.filter
})
case ADD_TODO:
return Object.assign({}, state, {
todos: [
...state.todos,
{
text: action.text,
completed: false
}
]
})
default:
return state
}
}
如果您要问 如何 Redux 将 reducer 与其状态的一部分相匹配,您可能会在此处阅读 Redux CombineReducers 代码找到答案:
https://github.com/reactjs/redux/blob/master/src/combineReducers.js
在第 147 行附近,您会看到每个 reducer 都应用于其状态键。
combineReducer
完成了这部分魔术。
这会调用传递的所有 reducers 对象中的每个 reducer,并构建具有相同形状的状态对象。
根据他们的 documentation:
As your app grows more complex, you'll want to split your reducing
function into separate functions, each managing independent parts of the
state.
The combineReducers helper function turns an object whose values are
different reducing functions into a single reducing function you can pass to
createStore.
在获得一些 React 基本概念后,我目前正在学习 Redux,我正在观看 Wes Bost 的 Learn Redux 视频系列,这是一个了不起的资源!
我有下一个问题,在该教程中我们有一家商店:
- 帖子
- 评论
评论
假设商店的每个 "part" 都应该有一个 "reducer",所以我们还有 "comments" 和 "posts" reducer,它们在 index reducer 中合并结合减速器。到目前为止一切正常,但我的问题来了:
假设我有 Comments reducer,它接收状态和操作,但它们的状态与 state.comments 匹配。 Posts 减速器也是如此,状态形状如何与状态的特定部分相匹配?
这是来自 Redux 文档:
Note that each of these reducers is managing its own part of the global state. The state parameter is different for every reducer, and corresponds to the part of the state it manages.
这是 Redux 设计的一部分。减速器管理自己的状态。根减速器结合了各个减速器的状态。 Redux 中只有一个商店具有组合状态。
减速器基于 action.type
运行。根据 type
你改变部分状态。他们不会自动知道。例如:
function todoApp(state = initialState, action) {
switch (action.type) {
case SET_VISIBILITY_FILTER:
return Object.assign({}, state, {
visibilityFilter: action.filter
})
case ADD_TODO:
return Object.assign({}, state, {
todos: [
...state.todos,
{
text: action.text,
completed: false
}
]
})
default:
return state
}
}
如果您要问 如何 Redux 将 reducer 与其状态的一部分相匹配,您可能会在此处阅读 Redux CombineReducers 代码找到答案:
https://github.com/reactjs/redux/blob/master/src/combineReducers.js
在第 147 行附近,您会看到每个 reducer 都应用于其状态键。
combineReducer
完成了这部分魔术。
这会调用传递的所有 reducers 对象中的每个 reducer,并构建具有相同形状的状态对象。
根据他们的 documentation:
As your app grows more complex, you'll want to split your reducing
function into separate functions, each managing independent parts of the
state.
The combineReducers helper function turns an object whose values are
different reducing functions into a single reducing function you can pass to
createStore.