vuex初始化

vuex的初始化

（1）文件目录

（2）index.js

import Vue from 'vue'
import Vuex from 'vuex'
import * as actions from './actions' //es6规则，将actions里面的所有方法都放到actions这个对里面，可以直接通过actions对象调用里面的方法                               
import * as getters from './getters'//同上
import mutations from './mutations'
import state from './state'
import createLogger from 'vuex/dist/logger'//vuex插件，可以输出日志

Vue.use(Vuex)

const debug = process.env.NODE_ENV !== 'prodution'//在测试环境下的debug模式

export default new Vuex.Store({
  actions,
  getters,
  mutations,
  state,
  strict: debug,
  plugins: debug ? [createLogger()] : []
})

（3）state.js

const state = {
  singer: {}
}

export default state

（4）mutation-types.js       这个文件是设置mutation里面方法的名字和类型

export const SET_SINGER = 'SET_SINGER'

（5）mutation.js             通过引入mutation-types.js里面的名字来实现这些方法

import * as types from './mutation-types'

const mutations = {
  [types.SET_SINGER](state, singer) {
    state.singer = singer
  }
}

export default mutations

（6）.getters.js     在其他页面中通过这个文件来获取state里面的数据

export const singer = state => state.singer

（7）actions.js      用于异步操作的文件