记录一下在vuex导入模块的方式

 假设我们是这样的目录结构

记录一下在vuex导入模块的方式

 

我们可以这样在index,js中导入不同的模块

记录一下在vuex导入模块的方式

 

 但是这样如果我们新增一个模块就要重新导入一次,相对来说增加了很多不必要的步骤,也容易出错

我们可以这样来动态的导入模块,就不需要新增一次就要进行一次导入

import Vue from ‘vue‘
import Vuex from ‘vuex‘
import getters from ‘./getters‘
// 使用vuex
Vue.use(Vuex)

// 这种方式很好的将modules中的所有文件全部导出,这样以后修改modules不用再在此处进行添加导出
const modulesFiles = require.context(‘./modules‘, true, /\.js$/)
const modules = modulesFiles.keys().reduce((modules, modulePath) => {
  const moduleName = modulePath.replace(/^\.\/(.*)\.\w+$/, ‘$1‘)
  const value = modulesFiles(modulePath)
  modules[moduleName] = value.default
  return modules
}, {})

// 创建vuex实例
const store = new Vuex.Store({
  modules,
  getters
})

export default store

 

记录一下在vuex导入模块的方式

上一篇:转载:MySQL数据库INSERT、UPDATE、DELETE以及REPLACE语句的用法详解


下一篇:Xcode5下使用纯代码构建简单的HelloWorld程序