简单使用介绍:
installation
$ npm install --save redux-actions
# 或
$ yarn add redux-actions
多余的使用
import { createAction, handleActions } from 'redux-actions';
const speak = createAction('SPEAK')
export const reducer6 = handleActions(
// reducerMap
{
[speak]: (state, action) => ({ ...state, speak: action.payload.speak })
},
{ speak: 'hello' },
// options
{
prefix: 'REDUX6',
namespace: '--'
}
)
上述方式略显多余,options中的prefix和namespace偶尔用一下还行,可以将dispatch的动作改造为带命名空间的REDUX6---SPEAK,这个看个人爱好了,我就直接简化了
直接一点,直接上最终用法
// store/index.js
import { combineReducers } from 'redux'
import * as app from './reducers/app'
export default combineReducers({ ...app })
// 如果想使用嵌套的方式,利用combineReducers去嵌套
app: combineReducers({ ...app })
})
// 如果想使用嵌套的数据格式,直接使用redux的combineReducers,不要尝试使用redux-actions中的嵌套的action结构,太不适合了
export default combineReducers({
app: combineReducers({ ...app })
})
// reducers/app.js
import { createAction, handleActions } from 'redux-actions';
export const reducer6 = handleAction(
{
SPEAK: (state, action) => {
return { ...state, speak: action.payload.speak })
}
},
{ speak: 'hello' }
)
使用combineReducers解决嵌套的数据结构的问题,redux-actions解决书写redux的问题,好像也挺简单的。