actions 配合 mapActions 并传参

src/components/Subtraction.vue

@@ -5,11 +5,15 @@
     <button @click="btnSub">-1</button>
     |
     <button @click="btnSubN">-N</button>
+    |
+    <button @click="btnSubAsync">异步1秒 -1</button>
+    |
+    <button @click="btnSubAsyncN">-N</button>
   </div>
 </template>
 
 <script>
-import {mapState, mapMutations} from 'vuex'
+import {mapState, mapMutations, mapActions} from 'vuex'
 
 export default {
   data() {
@@ -20,13 +24,19 @@ export default {
   },
   methods: {
     ...mapMutations(['sub', 'subN']),
-
+    ...mapActions(['subAsync', 'subAsyncN']),
     btnSub() {
       this.sub()
     },
 
     btnSubN() {
       this.subN(3)
+    },
+    btnSubAsync() {
+      this.subAsync()
+    },
+    btnSubAsyncN() {
+      this.subAsyncN(3)
     }
   },
 

src/store/index.js

@@ -32,7 +32,17 @@ export default new Vuex.Store({
       setTimeout(() => {
         context.commit('addN',payload)
       },1000)
-    }
+    },
+    subAsync(content) {
+      setTimeout(() => {
+        content.commit('sub')
+      },1000)
+    },
+    subAsyncN(content,payload) {
+      setTimeout(() => {
+        content.commit('subN',payload)
+      },1000)
+    },
   },
   modules: {}
 })