首页 > 其他 > 详细

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

时间:2021-09-23 08:23:30      阅读:22      评论:0      收藏:0      [点我收藏+]

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

技术分享图片

 

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

技术分享图片

 

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

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

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导入模块的方式

原文:https://www.cnblogs.com/MrSlow/p/15307841.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!