想必在平时工作中,我们经常会遇到需要封装组件组件的场景.但是传统的依次引入组件再逐个注册似乎的确不太方便,那有没有能够一行代码解决多个组件注册的办法呢,答案是:肯定有!!!
当我在学习webpack的过程中,惊奇的发现,webpack提供了一个require.context()方法,能够很好的解决批量注册组件的问题.
``
以上是具体的代码,其中require.context()这个方法有三个参数.参数一:路径参数规定查找符合条件组件的范围,图片示例中是指查找同级文件目录, 参数二:是否开启深度查找.值是布尔值, ,参数三:正则表达式,查找以.vue结尾的文件.
该方法会得到一个为函数的返回值,其中包含有一个keys()方法.通过返回值函数.keys()能够得到符合查找条件的路径数组.然后我们就可以通过遍历该数组,然后将每一个循环的item传入之前的那个返回值函数中,得到对应的组件内export default 导出的对象,最后就可以通过Vue.component()批量注册组件了.
