Javascript

vue 批量自动化注册组件

本文主要是介绍vue 批量自动化注册组件，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

一:用require提供的函数context,加载某一个目录下的所有.vue后缀的文件,代码写在index.js文件里

在这里插入图片描述
二:context函数会返回一个导入函数inportFn
inportFn这个函数有一个keys()属性,能获取所有文件的路径

三:遍历文件路径数组,再使用importFn根据路径导入组件对象

四:遍历的同时全局注册

const importFn=require.context('./',false,/\.vue$/)
//参数:第一个是目录,第二个是是否加载子目录,第三是加载的正则匹配
export default {
  install(app) {
    importFn.keys().forEach(key => {
      const component = importFn(key).default
      app.component(component.name, component)
    })
    
  }
}
这篇关于vue 批量自动化注册组件的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航