index.js
首先在 store 里面有两种写法
乍一眼看上去感觉多此一举, 我们直接分发 mutation 岂不更方便? 实际上并非如此, 还记得 mutation 必须同步执行这个限制么? Action 就不受约束! 我们可以在 action 内部执行异步操作:
- const actions={
- //context 在 actions 里面代表着整个的 store
- jiaplus(context){
- context.commit('jia',{a:1});
- setTimeout(() => {
- context.commit('jian');
- }, 1000);
- console.log('我先被执行了')
- },
- jianplus({commit}){
- commit('jian')
- }
- }
- export default new vuex.Store({
- state,
- mutations,
- getters,
- actions
- })
- vue
- <p>
- <button @click="jiaplus">+plus</button>
- <button @click="jianplus">-plus</button>
- </p>
- import { mapState,mapMutations,mapGetters,mapActions } from 'vuex'
- export default {
- name:'te',
- data(){
- return{
- counts:0
- }
- },
- computed:{
- ...mapState([
- 'count'
- ]),
- },
- methods:{
- ...mapActions([
- 'jiaplus',
- ]),
- ...mapActions({
- jianplus:'jianplus'
- })
- }
- }
来源: http://www.qdfuns.com/note/33603/c5f120fabe33fcb34aec6ece8e7eb73e.html