Action

来源于官网文档的翻译：
http://cn.redux.js.org/docs/basics/Actions.html

首先，让我们来给action下个定义。

Action 是把数据从应用（译者注：这里之所以不叫 view 是因为这些数据有可能是服务器相应，用户输入或其他非view的数据）传到 store 的有效载荷。它是store数据的唯一来源。

一般来说你会通过store.dispatch()将action传到store。

添加新 todo 任务的action是这样的：

const ADD_TODO = 'ADD_TODO'

{
    type: ADD_TODO,
    text: 'Build my first Redux app'
}

Action 本质上是 Javascript 普通对象。我们约定，action内必须使用一个字符串类型的type字段来表示将要执行的动作。多数情况下，type 会被定义成字符串常量。当应用规模越来越大时，建议使用单独的模块或文件来存放action。

import { ADD_TODO, REMOVE_TODO } from '../actionTypes'

样板文件使用提示
使用单独的模块或文件来定义 action type 常量并不是必须的，甚至根本不需要定义。对于小应用来说，使用字符串做action type 更方便些。不过，在大型应用中把它们显示的定义成常量还是利大于弊的。

除了 type 字段外，action 对象的结构完全由你自己决定。

这时，我们还需要再添加一个 action type 来表示用户完成任务的动作。因为数据是存放在数组中的，所以我们通过下标 index 来引用特定的任务。而实际项目中一般会在新建数据的时候生成唯一的ID作为数据的引用标识。

{
    type: COMPLETE_TODO，
    index: 5
}

我们应该尽量减少在action中传递的数据。比如上面的例子，传递index就比把整个任务对象传过去要好。

最后，再添加一个action 类型来表示当前的任务展示选项。

{
    type: SET_VISIBILITY_FILTER,
    filter: SHOW_COMPLETE
}

Action 创建函数

Action 创建函数就是生成action的方法。“action”和“action创建函数”这两个概念很容易混在一起，使用时最好注意区分。

在 Redux 中的action 创建函数只是简单的返回一个 action：

function addTo(text) {
    return {
        type: ADD_TODO,
        text
    }
}

这样做将使action创建函数更容易被移植和测试。

在传统的Flux实现中，当调用action 创建函数时，一般会触发一个 dispatch，像这样：

function addTodoWithDispatch(text) {
  const action = {
    type: ADD_TODO,
    text
  }
  dispatch(action)
}

不同的是，Redux 中只需要把 action 创建函数的结果传给 dispatch()方法即可发起一次 dispatch 过程。

dispatch(addTodo(text)
dispatch(completeTodo(index))

或者创建一个被绑定的action创建函数来自动dispatch：

const boundAddTodo = (text) => dispatch( addTodo(text) )
const boundCompleteTodo = (index) => dispatch( completeTodo(index) )

然后直接调用它们：

boundAddTodo( text )
boundCompleteTodo( text )

store 里能直接通过 store.dispatch( )调用dispatch( )方法，但是多数情况下你会使用 react-redux提供的 connect( ) 帮助器来调用。 bindActionCreators( )可以自动把多个action创建函数绑定到 dispatch( )方法上。

源码

/*
    action 类型
*/

export const ADD_TODO = 'ADD_TODO'
export const COMPLETE_TODO = 'COMPLETE_TODO'
export const SET_VISIBILITY_FILTER = 'SET_VISIBILITY_FILTER'

/*
    其他的常量
*/
export const VisibilityFilters = {
    SHOW_ALL: 'SHOW_ALL',
    SHOW_COMPLETED: 'SHOW_COMPLETED',
    SHOW_ACTIVE: 'SHOW_ACTIVE'
}

/*
    Action 创建函数
*/
exprot function addTodo(text) {
    return {
        type: ADD_TODO,
        text
    }
}
export function completeTodo(index) {
    return {
        type: COMPLETE_TODO,
        index
    }
}
export function setVisibilityFilter(filter) {
    return {
        type: SET_VISIBILITY_FILTER,
        filter
    }
}