关于Reactjs Redux中商店的澄清
我目前正在学习如何在我的ReactJS应用程序中使用Redux,我看到的所有教程都让我相信Redux中只能有一个商店。在现实世界的应用程序中,可能有多个来自RESTAPI或其他源的数据流。例如,我可能正在查看一个组件中的客户列表、另一个组件中的项目列表以及另一个组件中的用户列表。我的问题是:Redux是否允许您为每个实体创建一个具有自己的缩减器和操作的存储?例如,客户商店、项目商店和用户商店?如果不是的话,一个人怎么能在一个商店里组织这一切而不让一切变得复杂呢?谢谢 *编辑* 所以我的状态看起来像:关于Reactjs Redux中商店的澄清,reactjs,react-redux,Reactjs,React Redux,我目前正在学习如何在我的ReactJS应用程序中使用Redux,我看到的所有教程都让我相信Redux中只能有一个商店。在现实世界的应用程序中,可能有多个来自RESTAPI或其他源的数据流。例如,我可能正在查看一个组件中的客户列表、另一个组件中的项目列表以及另一个组件中的用户列表。我的问题是:Redux是否允许您为每个实体创建一个具有自己的缩减器和操作的存储?例如,客户商店、项目商店和用户商店?如果不是的话,一个人怎么能在一个商店里组织这一切而不让一切变得复杂呢?谢谢 *编辑* 所以我的状态看起来
let initalState={
customers:{
data:[]
...
},
projects:{
data:[]
...
}
users:{
data:[]
...
}
}
我想这就是你要找的
随着你的应用程序变得越来越复杂,你会希望将你的还原功能拆分为单独的功能,每个功能管理状态的独立部分
combineReducers辅助函数将值为不同还原函数的对象转换为一个可传递给createStore的还原函数
假设您想要管理客户、项目和用户
每个功能将获得一个减速器:
const customersInitialState = {data:[], ...}
export default function customersReducer(state = customersInitialState , action) {
switch (action.type) {
case 'ADD':
return {...state, data: [...state.data, action.payload]}
default:
return state
}
}
然后将所有这些减速机合并为一个减速机
export default combineReducers({
customers: customersReducer,
projects: projectsReducer,
users: usersReducer
})
const store = createStore(reducer)
最后,您商店的状态如下:
{
customers: {data: [], ...},
projects: {data: [], ...},
users: {data: [], ...},
}
您的应用程序中可以有多个存储,但我认为这不是常见的用例。为了解决您的问题,您可以将多个reducer与CombineReducer组合,但来自客户、项目、用户等的所有数据都位于一个状态中?它们位于同一个存储区,但数据将由多个reducer管理(在reducer上为客户,另一个为项目,另一个为用户…)编辑了我的帖子,以形象化地描述该州的情况。这是如何做到的吗?我更感兴趣的是数据从数据源(如RESTAPI)存储到哪里。数据是以单一状态存储的吗?我编辑了我的答案,以便为您提供有关组合多个减速器的更多信息