vuex

Vuex

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。Vuex背后的基本思想，就是前面所说的单向数据流。下图就是Vuex实现单向数据流的示意图

Vuex 的目的是为了管理共享状态，为了达到这个目的，它制定了一系列的规则，比如修改数据源 state、触发 actions 等等，都需要遵循它的规则，以此来达到让项目结构更加清晰且易于维护的目的

Vuex 中 Store 的模板化定义如下：

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { }, actions: { }, mutations: { }, getters: { }, modules: { } }) export default store

state：

每一个 Vuex 应用的核心就是 store（仓库）。store 基本上就是一个容器，它包含着你的应用中大部分的状态 (state)。 state 定义了应用状态的数据结构，同样可以在这里设置默认的初始状态

actions：

Actions就是从服务器端获取数据，在数据获取完成后会调用 store.commit()来调用更改 Store 中的状态。

const mutations = { SET_NEWS(state, val) { state.news= val } } export default mutations

1.increment官方说是type，其实就是注册的事件名 2.可以是单个参数 3.如果是多个参数，我们则用对象放入，否则会报错

getters:

getters 是store的计算属性，类似于computed,对state里的数据进行一些过滤，改造等等

假设我们要在state.count的基础上派生出一个新的状态newCount出来，就适合使用我们的 getters

getters 接受 state 作为其第一个参数

// 通常通过getters取数据 (this.$store.getters.news;) export const news = state => state.news // 不做其他处理 直接映射出去

modules

modules允许将当个store拆分成多个store，每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块——从上至下进行同样方式的分割