vuex 分模块

1. 文件夹创建：

创建一个 modules 文件夹，里面存放各种模块，外面一个 index.js 文件

文件夹内容：

index.js

import Vue from 'vue'
import Vuex from 'vuex'
import modules1 from './modules1' // 引入模块1

Vue.use(Vuex)

const store = new Vuex.Store({
  modules: {
   modules1 // 模块名
 }
})

export default store

// 切记导出

模块的内容

如：

const state = {
    abc:1
}

const mutations = {}

const actions = {}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}

普通调用

调用方法：

this.$store.commit('模块名/方法名');

调用变量：

this.$store.state.模块名.变量名;

高级调用

调用方法：

1.先引入 vuex

import { mapMutations } from "vuex"

2. 在 methods 里引入方法

...mapMutations('模块名',['方法名']),

3. 调用方法

this.方法名()

调用变量：

1. 引入vuex

import {mapState} from 'vuex';

2. 在 computed 里引入

...mapState('user',['模块名','变量名'])

3. 使用此变量

// 行内 如
:value = "变量名"

// 非行内
this.变量名