011-vuex的定义和基础使用方法

vuex的定义和基础使用方法

//projectName/src/store/index.js

import { createStore } from 'vuex'

export default createStore({

//定义所需状态, 所有的状态都只能在此定义

state: {

name: 'jack'

},

//修改状态的方法, 且只能在此地方进行修改

mutations: {

setName(state, payload){

state.name = payload

}

},

//异步调用修改状态的方法, 也就是异步提交mutations

//第一个参数是store, 第二个参数是修改的值

actions: {

asyncSetName(store, params){

setTimeout(() => {

//commit提交mutations, 调用mutations的方法

//第一个参数是mutations的方法名, 第二个是传的值, 也就是payload

store.commit('setName', params)

}, 2000);

}

},

//模块化

modules: {

}

})