vuex模块化组件,抛出组件命名规则?

//引入vue  和vuex 
//所有的导入和导出都是基于vue来运行的
//vuex模块化 (//方法
        state:{},
        getters:{},
        mutations:{},
        actions:{}
)
import Vue from "vue";
import Vuex from "vuex";
//引入名称 地址 
import cat from "./modules/cat";
import dog from "./modules/dog";

Vue.use(Vuex);

export default new Vuex.Store({
//抛出组件 cat dog
  modules: { cat, dog }
});

cat.js

export default {
  namespaced: true,
  // 局部状态
  state: {
    name: "蓝白英短",
    age: 1
  },
  // 局部读取
  getters: {//相当于计算属性
    desc: state => "宠物：" + state.name
  },
  // 局部变化
  mutations: {
    increment(state, payload) {
      state.age += payload.num;
    }
  },
  // 局部动作
  actions: {
    grow(context, payload) {
      setTimeout(() => {
        context.commit("increment", payload);
      }, 1000);
    }
  }
};

dog.js

export default {
  namespaced: true,
  // 局部状态
  state: {
    name: "拉布拉多",
    age: 1
  },
  // 局部读取
  getters: {
    desc: state => "宠物：" + state.name
  },
  // 局部变化
  mutations: {
    increment(state, payload) {
      state.age += payload.num;
    }
  },
  // 局部动作
  actions: {
    grow(context, payload) {
      setTimeout(() => {
        context.commit("increment", payload);
      }, 1000);
    }
  }
};