add a+b+c+d

第四次修改

vuex_demo1/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "vuex_demo1_1",
+  "name": "vuex_demo1",
   "version": "0.1.0",
   "private": true,
   "scripts": {

vuex_demo1/src/App.vue

@@ -4,17 +4,21 @@
     <my-add></my-add>
     <p>-----------------------------------------</p>
     <my-sub></my-sub>
+    <p>-----------------------------------------</p>
+    <box></box>
   </div>
 </template>
 
 <script>
 import add from './components/add.vue'
 import sub from "./components/sub.vue"
+import box from './components/box.vue'
 
 export default {
   components:{
     "my-add":add,
-    "my-sub":sub
+    "my-sub":sub,
+    box
   },
   data(){
     return{
@@ -26,4 +30,4 @@ export default {
 
 <style scoped>
 
-</style>
+</style>

vuex_demo1/src/components/add.vue

@@ -1,11 +1,11 @@
 <!--moguyun-->
 <template>
 <div>
-    <h3>当前最新的count值为：{{$store.state.count}}</h3>
+    <h3>当前最新的count值为：{{$store.state.countOptions.count}}</h3>
     <button @click="addcount">+1</button>
     <button @click="btnhandle">+1 Async</button>
     <button @click="btnhandle1">+5 Async</button>
-    <h3>{{$store.getters.showNum}}</h3>
+    <h3>{{$store.getters['countOptions/showNum']}}</h3>
 </div>
 </template>
 
@@ -18,16 +18,17 @@ export default {
     },
     methods: {
         addcount(){
-            this.$store.commit('add')
+           this.$store.commit('countOptions/add')
         },
         //异步让count自增1
         btnhandle(){
             //dispatch函数专门用来触发action
-            this.$store.dispatch('addAsync')
+            this.$store.dispatch('countOptions/addAsync')
         },
         btnhandle1(){
-            this.$store.dispatch('addNAsync',5)
+            this.$store.dispatch('countOptions/addNAsync',5)
         }
-    }
+    },
+
 }
 </script>

vuex_demo1/src/components/box.vue

@@ -0,0 +1,24 @@
+<template>
+    <div>
+        <div>这是box组件，测试,test</div>
+        <button @click="divide(2)">除2</button>
+        <div>count的值为：{{count}}</div>
+    </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+export default {
+    data(){
+        return{ }
+    },
+    methods:{
+        divide(num){
+            this.$store.commit('countOptions/divide',num)
+        }
+    },
+    computed:{
+        ...mapState('countOptions',['count'])
+    }
+}
+</script>

vuex_demo1/src/components/sub.vue

@@ -16,12 +16,12 @@ export default {
         return{ }
     },
     methods:{
-        ...mapMutations(['subN','xc']),
+        ...mapMutations('countOptions',['subN','xc']),
-        ...mapActions(['subNAsync']),
+        ...mapActions('countOptions',['subNAsync']),
     },
     computed:{
-        ...mapState(['count']),
+        ...mapState('countOptions',['count']),
-        ...mapGetters(['showNum','showNum1'])
+        ...mapGetters('countOptions',['showNum','showNum1'])
     }
 }
 </script>

vuex_demo1/src/store/count.js

@@ -0,0 +1,55 @@
+export default {
+  namespaced: true,
+  state: {
+      //存放全局共享数据
+      count:0
+    },
+    getters: {
+      showNum(state){
+        let newcount = state.count *2
+        return '测试getters,更新的数量为count*2: '+ newcount
+      },
+      showNum1(state){
+        let newcount = state.count *3
+        return '测试getters,更新的数量为为count*3: '+ newcount
+      }
+    },
+    mutations: {
+      //变更store中的数据
+      add(state){
+        state.count++
+      },
+      addN(state,step){
+        state.count+=step
+      },
+      sub(state){
+        state.count--
+      },
+      subN(state,step){
+        state.count-=step
+      },
+      xc(state,step){
+        state.count=state.count * step
+      },
+      divide(state,num){
+        state.count = state.count / num
+      }
+    },
+    actions: {
+      addAsync(context){
+        setTimeout(()=>{
+          context.commit('add')
+        },1000)
+      },
+      addNAsync(context,step){
+        setTimeout(()=>{
+          context.commit('addN',step)
+        },1000)
+      },
+      subNAsync(context,step){
+        setTimeout(()=>{
+          context.commit('subN',step)
+        },1000)
+      }
+    },
+}

vuex_demo1/src/store/index.js

@@ -2,58 +2,11 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 
+import countOptions from '@/store/count'
 Vue.use(Vuex)
 
 export default new Vuex.Store({
-  state: {
-    //存放全局共享数据
-    count:0
-  },
-  getters: {
-    showNum(state){
-      let newcount = state.count *2
-      return '测试getters,更新的数量为count*2: '+ newcount
-    },
-    showNum1(state){
-      let newcount = state.count *3
-      return '测试getters,更新的数量为为count*3: '+ newcount
-    }
-  },
-  mutations: {
-    //变更store中的数据
-    add(state){
-      state.count++
-    },
-    addN(state,step){
-      state.count+=step
-    },
-    sub(state){
-      state.count--
-    },
-    subN(state,step){
-      state.count-=step
-    },
-    xc(state,step){
-      state.count=state.count * step
-    }
-  },
-  actions: {
-    addAsync(context){
-      setTimeout(()=>{
-        context.commit('add')
-      },1000)
-    },
-    addNAsync(context,step){
-      setTimeout(()=>{
-        context.commit('addN',step)
-      },1000)
-    },
-    subNAsync(context,step){
-      setTimeout(()=>{
-        context.commit('subN',step)
-      },1000)
-    }
-  },
   modules: {
+    countOptions
   }
 })

vuex_demo1/test.md

@@ -0,0 +1,4 @@
+a
+b
+c
+d

vuex_demo1/test.txt

@@ -0,0 +1,4 @@
+测试远程dev分支
+主分支修改
+测试合并
+update dev