vue 动态注册组件,Vue提供方法中,可以用来实现全局注册组件的是

　　本文主要介绍vue实现基础组件自动全局注册的方法，帮助大家更好的理解和使用vue框架。感兴趣的朋友可以了解一下。

　　参考https://cn.vuejs.org/v2/guide/components-registration.html,官网

　　日常开发中，有些组件是常用的，但是为了避免在开发过程中不断引入，或者在main.js中注册，或者手动注册每个组件。直接执行自动全局注册。

　　自动全球注册在官网有详细描述。以下是根据我自己在官网描述的demo开发实例：

1、自定义文件夹：

　　在src下创建一个新的组件文件夹来存储组件。并创建一个新的来存储需要自动全局注册的组件，如base。

2、在base文件夹下定义index.js，具体代码如下示：

　　//基本组件的自动全局注册

　　从“vue”导入Vue

　　const require component=require . context(

　　//其组件目录的相对路径。/,

　　//查询其子目录？

　　没错，

　　//与基础组件的文件名匹配的正则表达式

　　/\.vue$/

　　)

　　requireComponent.keys()。forEach(文件名={

　　//获取组件配置

　　const component config=require component(文件名)

　　//全局注册组件

　　组件(

　　Componentconfig.default.name，//这里的名称是component属性定义的名称。

　　//如果此组件选项通过导出默认值导出，

　　//然后`。将首先使用默认值，

　　//否则退回到用法模块的根。

　　componentConfig .默认值

　　)

　　})

　　上面的代码需要解释一下：

　　1.匹配基础组件文件名的正则表达式，需要根据实际组件名称和规则进行配置；

　　2.componentConfig.default.name这里用来表示组件的名称，但不是固定的写法。组件名称可以用不同的方式表示。例如，也可以直接解析fileName来获得文件夹名作为组件名。componentConfig.default.name中的名称来自定义组件时的页面名称。如果页面上没有定义名称，将会报告一个错误。

3、在main.js中引入index.js文件

　　因为全局注册的行为必须发生在创建根Vue实例之前(通过new Vue)。

　　//基本组件的自动全局注册。全局注册的行为必须发生在创建根Vue实例之前(通过new Vue)。

　　“导入”。/组件/基本/索引

4、直接在需要的地方使用该组件即可

　　页面效果如下：

　　以上就是vue实现基础组件自动全局注册的细节。更多关于vue组件全球注册的信息，请关注我们的其他相关文章！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。