Redux 和 Vuex 的区别

vuex 和 redux 都是状态管理库，用于单独管理状态的。其中，redux是一个范用的库，可以单独使用。而vuex是专门用来配合vue使用的。他们都应用了flux架构的思想，但是在接口的提供上稍有不同。

1. 核心概念对比

Redux 的核心概念

   action （同步action ，或借助 中间件 实现异步操作，action 不会改变 store，只是描述了怎么改变store）| mutation（用于同步操作） 、action（可用于异步操作，提交 mutation）

   reducer（纯函数，根据 action 和旧的 store 计算出新的 store)

   store（单一数据源）

Vuex 的核心概念

   mutation（用于同步操作） 、action（可用于异步操作，提交 mutation）

   mutation里面直接修改 state

   state（单一数据源）

2. 使用原则：

Redux 的三大原则：

  （1）单一数据源（一个Redux应用只有一个store），也是单向的数据流

  （2）state只读（唯一改变 state 的方法就是触发 action，action 是一个用于描述已发生事件的普通对象）

  （3）使用纯函数（reducer）来修改state。

    redux的流程：

　　view——>action——>store——>reducer（返回）——>store——view

Vuex 的三大原则：

  （1） 应用层级的状态应该集中到单个 store 对象中。

  （2） 提交 mutation 是更改状态的唯一方法，并且这个过程是同步的。

  （3）异步逻辑都应该封装到 action 里面。

  vue的流程：

       vueComponent——>(dispatch)action——>（commit）——>mutations——>（mutate）state——>（render）vueComponent

3. 处理异步操作

Redux 的中间件机制，利用 redux-thunk ，redux-thunk可以dispatch函数，这个函数用于生成action，所以在这个函数里我们可以进行异步操作，等异步的结果出来后再放在action里面，将这个action用dispatch分发出去，而这个函数被叫做 “action creator”，可以将异步逻辑放在 action creator 里面，给 action creator 传入 dispatch 作为参数，于是就可以 dispatch action，Redux 并没有创造单独的概念出来专门用于异步逻辑，它是利用了 Redux 自己实现的中间件机制，中间件从 dispatch 一个异步 action 到 action 到达 reducer 之间处理 action，在这期间通过异步操作得到的结果可以放到 action 里面再通过 dispatch 分发到 reducer，以前 dispatch 一个 action 之后，这个 action 回立即到达 reducer ，所以是同步 action，现在在 action creator 里面，可以等待异步操作结果再生成 action 分发，所以叫做异步 action

而 Vuex 是用 mutation 来对应 Redux 的 action，另外 Vuex 又创造了一个 action 来提交 mutation 并通过异步提交 mutation 来实现异步操作结果能够修改 state.