27.为什么要使用actionCreator统一管理组件上的action？ - yiqunkeke/react-jianshu-shangguigu-zty GitHub Wiki

观察下之前TodoList组件中的代码:

import store from './store' 
import {CHANGE_INPUT_VALUE, ADD_TODO_ITEM, DELETE_TODO_ITEM } from './store/actionTypes'

handleInputChange = (e) => {
    // 在业务逻辑中创建 action
    const action = {       
       type: CHANGE_INPUT_VALUE,
       value: e.target.value
    }
    store.dispatch(action)
}

handleBtnClick = () => {
   // action 分散在各个业务逻辑当中
   const action = {
       type: ADD_TODO_ITEM
    }
   store.dispatch(action)
}

handleDeleteItem = (index) => {
    // action 分散在各个业务逻辑当中
    const action = {
        type: DELETE_TODO_ITEM,
        index: index
    }
}

我们的action都是直接在组件上来创建的。action的创建都分散在各个业务逻辑里面。 这样做不是不行，但是我们通常会使用actionCreator来统一管理页面上的action。

然后 通过actionCreator来创建action。这是一个比较标准正规的流程。

当然，像Todolist这种比较简单的功能，action 分散在各个业务逻辑里面也还可以。如果业务逻辑非常复杂的话，你的action到处都是，实际上到之后进行测试和管理都是不太方便的。

所以，我们要把action 拆分到actionCreators 里面。去统一的创建和管理。