首页 > 其他分享 >Vue 指定目录下的组件注册为全局组件

Vue 指定目录下的组件注册为全局组件

时间:2023-01-29 17:23:02浏览次数:43  
标签:index Vue const vue requireComponent 组件 全局

// index.js import Vue from 'vue'
const requireComponent = require.context(   // 组件的相对路径   './',   // 是否查询其子目录   true,   // 匹配基础组件文件名的正则表达式, 这里匹配文件名为xxx.vue格式   /index.vue$/ ) requireComponent.keys().forEach(fileName => {   // 获取组件配置   const componentConfig = requireComponent(fileName)   // 剥去文件名开头的 `./` 和结尾的扩展名 eg: ./food-header.vue -> foodHeader   const componentName = fileName.replace(/^\.\//, '').replace(/\/index.vue$/, '')   Vue.component(     componentName,     // 如果这个组件选项是通过 `export default` 导出的,     // 那么就会优先使用 `.default`,否则回退到使用模块的根。     componentConfig.default || componentConfig   ) })   main.js页面引入 import '@/commonComponent/index'; // 全局公共组件    

标签:index,Vue,const,vue,requireComponent,组件,全局
From: https://www.cnblogs.com/zerofan/p/17073258.html

相关文章

  • 组件基础
    组件基础组件使用在components中注册,也可以全局注册一个组件每次使用组件,都重新创建了实例,变量值是不同的推荐标签名:大驼峰propsprops是一种特别的属性,子组件使用......
  • JavaWeb-VUE&Element
    JavaWeb-VUE&Element1,VUE1.1概述Vue是一套前端框架,免除原生JavaScript中的DOM操作,简化书写。Mybatis是用来简化jdbc代码编写的;而VUE是前端的框架,是用来简化Ja......
  • Error: error:0308010C:digital envelope routines::unsupported(vue2项目报错)
    问题描述在终端输入 npmrundev 命令,项目运行报错Error:error:0308010C:digitalenveloperoutines::unsupported问题原因node 版本过高,可以在命令行 输入......
  • DataGear 制作基于Vue2、Element UI前端框架的数据可视化看板
    DataGear数据可视化看板内置了一些基本、简单的页面交互组件,当它们无法满足实际看板需求时,可以引入更流行和强大的前端框架。本文以Vue2、ElementUI前端框架为例,介绍如......
  • 面试--Vue
    1.你对MVVM是怎么理解的?MVVM是Model-View-ViewModel缩写。Model层代表数据模型,View代表视图层,ViewModel是MVVM的核心,它是连接View和Model层的桥梁,数据会绑定到viewMod......
  • vue表单校验必填项
    1.要求在做一些用户信息相关的功能时,经常用到表单项去收集数据,其中有些属性必须填写,2.实现方法在data中添加一个rules来规定:rules:{no:[{required:true,......
  • GFast V3.2.1 版本发布,采用 GoFrame 2.3 + Vue3 后台管理系统
    平台简介基于全新GoFrame2.3+Vue3+ElementPlus开发的全栈前后端分离的管理系统前端采用vue-next-admin、Vue、ElementUI。特征高生产率:几分钟即可搭建一个后台管......
  • vue3+betterScroll scroll滚动组件
    betterScroll在MVVM框架中使用时最麻烦的是更新时机,一般的需要滚动的列表数据都是来源于后端,是异步的。就必须要渲染完后refresh()一下。但是单独的Scroll组件是通过插槽放......
  • Python定义全局变量的用法
    全局变量是编程语言中常见的一种变量,通过全局定义,可以是某对象函数创建,也可以是本程序任何位置创建,能够被本程序中的所有对象或函数进行引用,全局变量的定义有利于程序的变......
  • vue-3 this概念
    一、this概念官方是这样说的:在 setup()内部,this不会是该活跃实例的引用因为setup()是在解析其它组件选项之前被调用的,所以setup()内部的this的行为与其它选项中......