vue统一注册组件
文件夹下面组件数量较多,如果每一个组件先import然后在 components,虽然灭有问题,但是会导致代码量大,而且不直观

解决办法:
将图元组件进行统一注册
新建一个pixels文件,文件里面的内容
import Vue from 'vue'
function importAll(r) {
r.keys().forEach((key) => {
// 组件实例
const reqCom = r(key)
// 截取路径作为组件名
const reqComName = key.replace(/^\..*\/(.*)\.\w+$/, '$1')
// 组件挂载
Vue.component(reqComName, reqCom.default || reqCom)
})
}
// 在构建时,所有被 require 的组件都会被注册,匹配当前目录下Pixel目录下所有的vue文件
importAll(require.context('./', true, /Pixel\.vue$/))
这样
Pixel目录下所有的vue文件都会被统一注册

vue统一注册组件的更多相关文章
- vue install 注册组件
1.myPlugin.js文件 let MyPlugin = {}; MyPlugin.install = function (Vue, options) { // 1. 添加全局方法或属性 Vue. ...
- Vue.js 注册组件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue.js之组件(上篇)
本文的Demo和源代码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星星! https://github.com/zwl-jasmine95/Vue_test 以下所有知 ...
- Vue 入门之组件化开发
Vue 入门之组件化开发 组件其实就是一个拥有样式.动画.js 逻辑.HTML 结构的综合块.前端组件化确实让大的前端团队更高效的开发前端项目.而作为前端比较流行的框架之一,Vue 的组件和也做的非常 ...
- VueJs(8)---组件(注册组件)
组件(注册组件) 一.介绍 组件系统是Vue.js其中一个重要的概念,它提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用,任意类型的应用界面都可以抽象为一个组件树 那么什么是组件呢? 组 ...
- vue.js之组件篇
Vue.js 组件 模块化:是从代码逻辑的角度进行划分的: 组件化:是从UI界面的角度进行划分的. 组件(Component)是 Vue.js 最强大的功能之一,组件可以扩展 HTML 元素,封装可重 ...
- 手把手教你实现一个 Vue 进度条组件!
最近在个人的项目中,想对页面之间跳转的过程进行优化,想到了很多文档或 npm 等都用到的页面跳转进度条,于是便想自己去实现一个,特此记录. 来看下 npm 搜索组件时候的效果: so 下面咱们一起动手 ...
- 详解Vue大护法——组件
1.什么是组件化 人面对复杂问题的处理方式: 任何一个人处理信息的逻辑能力都是有限的 所以,当面对一个非常复杂的问题时,我们不太可能一次性搞定一大堆的内容. 但是,我们人有一种天生的能力,就是将问题进 ...
- 为什么VUE注册组件命名时不能用大写的?
这段时间一直在弄vue,当然也遇到很多问题,这里就来跟大家分享一些注册自定义模板组件的心得 首先"VUE注册组件命名时不能用大写"其实这句话是不对的,但我们很多人开始都觉得是对的, ...
随机推荐
- mac安装mysql数据库及配置环境变量
mac安装mysql数据库及配置环境变量 mac安装mysql数据库及配置环境变量 原文文链接:https://blog.csdn.net/qq_36004521/article/details/80 ...
- Mybatis 事物回滚最简单的操作方式
简单例子 //假设这是一个service类的片段 try{ //出现异常 } catch (Exception e) { e.printStackTrace(); //设置手动回滚 Transacti ...
- ubuntu tensorflow cpu faster-rcnn 测试自己训练的模型
(flappbird) luo@luo-All-Series:~/MyFile/tf-faster-rcnn_box$ (flappbird) luo@luo-All-Series:~/MyFile/ ...
- ehcache快速入门
前言 JAVA缓存实现方案有很多,最基本的自己使用Map去构建缓存,或者使用memcached或Redis,但是上述两种缓存框架都要搭建服务器,而Map自行构建的缓存可能没有很高的使用效率,那么我们可 ...
- Day04:循环结构(while、do-while、for)
Java 循环结构 - while ,do...while,for 反复执行一段相同或相似代码的格式. 顺序结构的程序语句只能被执行一次.如果您想要同样的操作执行多次,,就需要使用循环结构. Java ...
- ajax提交文件,django测试脚本环境书写,froms组件,钩子函数
1.在新版本中,添加app是直接在settings设置中,将INSTALLED_APPS里添加app名字, 但是他的完整写法是 'app01.apps.App01Config' 因为新版本做了优 ...
- leetcode548 Split Array with Equal Sum
思路: 使用哈希表降低复杂度.具体来说: 枚举j: 枚举i,如果sum[i - 1] == sum[j - 1] - sum[i],就用哈希表把sum[i - 1]记录下来: 枚举k,如果sum[k ...
- 39.创建多进程及进程通讯 -- Queue--Pipe--Event
创建多进程 windows:进程.线程 linux:进程.线程(做了进程通信的多进程实现的线程) 进程之间内存彼此独立,不管是父子进程还是单个独立进程 multiprocessing:Process ...
- bitmap位图原理和实现
引子 首先通过一道题来理解什么是bitmap. 题目:我有40亿个整数,再给一个新的整数,我需要判断新的整数是否在40亿个整数中,你会怎么做? 分析: 假设一个int占4个字节(32位),40个亿个整 ...
- 一个自己稍作修改了的美赛论文 LaTeX 模板
警告:这是旧版模板的发布页面.本站已经发布了最新版的美赛模板 easymcm(2020 年美赛可用),请到该页面查看: https://www.cnblogs.com/xjtu-blacksmith/ ...