vuex学习之Actions的用法详解

vuex学习之Actions的用法详解

Action 类似于 mhttp://utation，不同在于：

Action 提交的是 mutation，而不是直接变更状态. Action 是异步的，mutation是同步的。

沿用vuex学习---简介的案例：这里是加10 减1

1.在store.js 中 代码为：

import Vue from 'vue'

import Vuex from 'vuex'

//使用vuex模块

Vue.use(Vuex);

//声明静态常量为4

const state = {

count : 4

};

const mutations = {

add(state,n){

state.count +=n.a;

},

sub(sthttp://ate){

state.count--;

}

};

const actions = {

//2种书写方式

addplus(context){ //可以理解为代表了整个的context

context.commit('add',{a:10})

},

subplus({commit}){

commit('sub');

}

};

//导出一个模块

export default new Vuex.Store({

state,

mutations,

actions

})

2.在App.vue中 代码如下：

组件内部count{{count}}

+

-

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。