redux-actions简单使用总结

redux-actions简单使用总结

动机: 对于redux原生用法，不喜欢过于繁重的actions-types常量定义以及switch case的书写方式，redux就是一个工具，不喜欢在工具上面，浪费很多体力，这点刚好跟redux-actions动机一致，使用下来也觉得很是方便。

API文档过了一遍，除了handleAction(s)，没发现特别非用不可的东西，除了对一个prefix略感兴趣

简单使用介绍:

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的问题，好像也挺简单的