构建一个项目时,一个仓库组件往往放不了那么多数据,并且后期很难管理,不易维护,仓库拆分可以将仓库数据以模块化的形式存储。
这里创建的 store/index.js 仅仅是引入其他组件的仓库数据
//store / index.js
import { createStore } from 'redux'
import reducer from './todu'
const store = createStore(reducer,window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())
export default store
// todu / index.js
const initState = {
inputvalue:'',
todus : [
'吃饭',
'睡觉'
]
}
const reducer = (state = initState , action)=>{
if(action.type === 'CHANGE_CON'){
return state={
...state,
inputvalue: action.value
}
}else if(action.type==='DELETE_LI'){
let newState = JSON.parse(JSON.stringify(state))
newState.todus.splice(action.index,1)
return state={
...state,
todus:newState.todus
}
}else if(action.type==='ADD_LIST'){
let newState = JSON.parse(JSON.stringify(state))
newState.todus.push(state.inputvalue)
return state={
...state,
todus:newState.todus
}
}
return state
}
export default reducer
这里只分出一个仓库数据,还可以继续拆分。
网友评论