vuexモジュールの名前空間

export default new Vuex.Store({
  //存储数据
  state:{

  },
  //方法
  mutations:{

  },
  //计算属性
  getters:{

  },
  //异步方法,(如ajax)
  actions:{

  },
  //模块
  modules:{
	可以存放其他store
		格式为:
		
		(1)名称:{namespaced:true,state:{xx},mutations:{xx},getters:{xx},actions:{xx}}
		
		若为mod文件
		(1)文件中export default{ namespaced:true,state:{xx},mutations:{xx},getters:{xx},actions:{xx}}
		
		在组件中调用:
		第一种:
		state:	$store.state.模块名.键名
		getters:$store.getters['模块名/方法名')
		actions:$store.dispatch('模块名/方法名')
		mutations:$store.commit('模块名/方法名')
		
		第二种,使用命名mapState辅助函数,只对state有效
		import {mapState} from 'vuex'
		computed:{...mapState(['模块名'])}
		调用:模块名.键名
		
		

  }
})

コード例：
モジュールの導入：

export default{
  namespaced:true,
  state:{
    productNum:10
  },
  getters:{
    brief:function(state){
      return state.productNum+'件衣服';
    }
  },
  actions:{

    changeProNum(content){
      setTimeout(()=>{
        content.commit('addProNum');
      },1000)
     }
  },
  mutations:{
    addProNum(state){
      return state.productNum++;
    }
  }
}

コンポーネント：

<template>
  <div>

  <h1>{{$store.state.mod1.productNum}}</h1>
  <h2>{{mod1.productNum}}</h2>
   <h3>{{$store.getters['mod1/brief']}}</h3>
    <button @click='$store.commit("mod1/addProNum")'>添加</button>
  <button @click='$store.dispatch("mod1/changeProNum")'>异步添加</button>
  </div>
</template>

<script>
  import {mapState,mapActions,mapGetters,mapMutations} from 'vuex'
  //获取模块state内容
  let mapStateObj=mapState(['mod1'])
  //获取模块getters内容
  // let mapGettersObj=mapGetters(['brief'])
  // let mapMutationsObj=mapMutations(['addProNum'])

  // let mapActionsObj=mapActions(['changeProNum']);
  export default{
    name:'A',
    data()
    {
      return{
         count:0
      }
    },
    methods:{

    },
    computed:{
        ...mapStateObj,
        // ...mapGettersObj,
        // ...mapMutationsObj,
    },
    mounted()
    {
      console.log(this);
    },
    methods:{
      // ...mapActionsObj
    }
  }
</script>

<style>
</style>