我想了解Redux并遇到一些困难.
我理解combineReducer的概念,即....
var reducer = combineReducers({ user: userReducer, products: productsReducer })
但是,如果我有数千种产品,只能在产品页面上找到.我不明白为什么我需要在root上加载它们; 对我而言,除非用户访问产品页面,否则这将减慢应用程序的初始启动速度.
这是与redux的关系吗?
在Redux应用程序中,您始终可以在一开始就构建整个状态.使用Redux,你有一个商店和一个状态 - 一切都应该从那个状态逐渐渗透到组件的道具上.但是,这并不意味着您实际上需要在启动时将所有数据加载到状态,只需要结构需要存在.这就是为每个reducer设置初始状态对象的原因.
假设您有数千个从数据库加载的产品记录.在您的产品减速机中,您可以执行以下操作:
const initialState = { data: [] }; //use ES6 default parameters function productsReducer (state = initialState, action) { switch (action.type) { case 'GET_PRODUCTS': //return data from action return { data: action.result }; default: return state; } }
这意味着当您启动应用程序时,如果您使用在帖子中声明的完整reducer,您的应用程序状态将如下所示:
{ user: {}, products: { data: [] } }
products.data
将是一个空数组,直到您触发实际需要您加载产品数据的操作(即您转到应用程序中的"产品"页面或其他内容).如果您随后进入应用程序的其他地方,产品数据确实会保留在您的状态,但这是一件好事 - 下次渲染产品页面时,您可以随时获取数据而无需执行数据库抬头.