vue全局组件自动注册直接使用,无需单独先引用注册再使用
目录结构:
本案例是在根目录下components文件夹测试的,文件位置项目内任意,确保在main.js挂载路径正确即可


1、新建文件夹(名字随意)zxy_components (放自己组件的地方)
2、在zxy_components文件夹下
!新建文件夹zxy_ui(放vue文件)
!!新建index.js(放挂载全局组件的方法)
3、自定义两个组件zxy-style.vue和zxy-button.vue
代码: 自定义组件中切记有组件名name:'组件名'
zxy-style.vue
<template><div><h1>这是我的全局组件!!!</h1></div>
</template><script>export default {name: 'zxy-style',data() {return {}},mounted() {},methods: {}}
</script><style lang="scss" scoped></style>
zxy-button.vue
<template><div class="row button"><el-button type="primary" size="mini" @click="$emit('add')">新增</el-button><el-button type="primary" size="mini" @click="$emit('authorizeBtn')">审批</el-button><el-button type="primary" size="mini" @click="$emit('exportBtn')">导出</el-button></div>
</template><script>export default {name: 'zxy-button',data() {return {}},mounted() {},methods: {}}
</script><style lang="scss" scoped>.button {margin-bottom: 12px;}.button {margin-left: 15px;margin-top: 20px;}
</style>
4、index.js方法:
import Vue from 'vue';//自动加载 zxy_ui 目录下的 .vue 结尾的文件
const componentsContext = require.context("./zxy_ui", true, /\.vue$/)
// componentsContext 是一个函数
// componentsContext.keys() 是包含zxy_ui目录下vue文件的数组
componentsContext.keys().forEach(item => {//componentsContext(item) 是一个模块const componentConfig = componentsContext(item);// 兼容 import export 和 require module.export 两种规范const assembly = componentConfig.default || componentConfigVue.component(assembly.name, assembly) //注册当前组件
})
5、main.js挂载:
import '@/components/zxy_components';
6、页面使用:不需要引用注册
<template><div><zxy-style></zxy-style><zxy-button></zxy-button></div>
</template>
相关文章:
vue全局组件自动注册直接使用,无需单独先引用注册再使用
目录结构: 本案例是在根目录下components文件夹测试的,文件位置项目内任意,确保在main.js挂载路径正确即可 1、新建文件夹(名字随意)zxy_components (放自己组件的地方) 2、在zxy_components文件夹下 !新建…...
【HarmonyOS】@ohos.request 上传下载的那些事儿
【关键字】 ohos.request、上传下载 【写在前面】 在进行HarmonyOS应用开发时,可能需要进行上传或下载文件功能开发,本文章主要进行上传下载相关功能介绍和一些注意事项及FAQ。 【上传开发步骤】 步骤1:上传下载接口需要申请ohos.permis…...
github版面混乱加载不出的解决办法
最近出现打开github 界面加载不成功,网页访问乱码,打开chrome的检查发现 github的github.githubassets.com 拒绝访问, 解法: 1.先打开hosts文件所在的目录C:\Windows\System32\drivers\etc 2.右键点击hosts文件-选择用记事本或者…...
dotNet 之数据库sqlite
Sqlite3是个特别好的本地数据库,体积小,无需安装,是写小控制台程序最佳数据库。NET Core是同样也是.NET 未来的方向。 **硬件支持型号 点击 查看 硬件支持 详情** DTU701 产品详情 DTU702 产品详情 DTU801 产品详情 DTU802 产品详情 D…...
走近ChatGPT与类似产品:原理解析与比较
目录 1. 引言1.1 技术的进步与自然语言处理1.2 ChatGPT的崭新概念 2. ChatGPT: 一览众山小2.1 GPT-3.5架构简介2.2 ChatGPT的学习与训练2.3 文本生成的工作原理 3. 市场上类似产品调研3.1 对话式人工智能产品分类3.2 文心一言3.3 讯飞星火 4. 应用前景与局限性展望4.1 ChatGPT的…...
HarmonyOS SDK开放能力,服务鸿蒙生态建设,打造优质应用体验
华为开发者大会2023(HDC.Together)于8月4日至6日在东莞松山湖举行,在HarmonyOS端云开放能力技术分论坛上,华为为广大开发者们介绍了HarmonyOS SDK开放能力在基础开发架构、功能特性等方面的变化之处,通过将常见的通用能…...
数字经济对产业结构升级和创业增长的影响(2011-2021年)
参照刘翠花(2022)的做法,对来自中国人口科学《数字经济对产业结构升级和创业增长的影响》一文中的基准回归部分进行复刻。文章从理论层面分析数字经济发展对产业结构升级、创业增长的影响及其机理,并利用2011-2021年中国省级面板数…...
GPT-4助力数据分析:提升效率与洞察力的未来关键技术 | 京东云技术团队
摘要 随着大数据时代的到来,数据分析已经成为企业和组织的核心竞争力。然而,传统的数据分析方法往往无法满足日益增长的数据分析需求的数量和复杂性。在这种背景下,ChatGPT-4作为一种先进的自然语言处理技术,为数据分析带来了革命…...
Zabbix6 对接飞书告警
文章目录 Zabbix对接飞书告警背景创建飞书群组Zabbix配置创建告警媒介类型创建动作用户关联飞书告警 Zabbix对接飞书告警 背景 运维 你看下他的进程是不是挂了,之前在9点28分有发消息的,这次没有发消息 哐哐哐的去看了一通,确实有个进程之前…...
Javascript异步编程的4种方法
你可能知道,Javascript语言的执行环境是"单线程"(single thread)。 所谓"单线程",就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一…...
【MySQL】表的内外连接
目录 一、内连接 二、外连接 1、左外连接 2、右外连接 一、内连接 内连接实际上就是利用where子句对两种表形成的笛卡儿积进行筛选,我们前面学习的查询都是内连接,也是在开发过程中使用的最多的连接查询。 语法: select 字段 from 表1 i…...
详解Mysql——第一篇/连接查询
mysql的连接查询,相必在网上都能找到很多的教程,博主今天不做老话常谈,不走重复路线 1.建表 –1.学生表 Student(s_id,s_name,s_birth,s_sex) –学生编号,学生姓名, 出生年月,学生性别 –2.课程表 Course(c_id,c_name,t_id) – –课程编…...
uniapp获取屏幕宽度时 获取不到移动设备中内容盒子宽度
首先 :我使用的是uniapp vue3语法: 问题: 我出现这个问题是IOS 设备发现的,data.boxWidth为0 代码: const initCreated () > {const query uni.createSelectorQuery().in(instance.proxy);const el query.select…...
篇十二:代理模式:控制对象访问
篇十二:“代理模式:控制对象访问” 开始本篇文章之前先推荐一个好用的学习工具,AIRIght,借助于AI助手工具,学习事半功倍。欢迎访问:http://airight.fun/。 另外有2本不错的关于设计模式的资料,…...
P1657 选书
1:思路:一看数据,嗯....!,爆搜嘛?,看一眼题目,嗯!!!,爆搜! 配上俺的无敌小剪枝,按下拿下! 2:暴力枚举每个人获…...
代码随想录第46天 | 139. 单词拆分、多重背包
139. 单词拆分 确定dp数组以及下标的含义 dp[i] : 字符串长度为i的话,dp[i]为true,表示可以拆分为一个或多个在字典中出现的单词。 确定递推公式 如果确定dp[j] 是true,且 [j, i] 这个区间的子串出现在字典里,那么dp[i]一定是tru…...
Unreal View Model结合GAS使用
这个东西真的难用,各种问题,记录下 官方文档 bilibili教学 开启插件 插件开启 Viewmodel: build.cs内PublicDependencyModuleNames加上ModelViewViewModel 创建ViewModel类 #pragma once#include "CoreMinimal.h" #include &quo…...
Spring-Cloud-Loadblancer详细分析_2
LoadBalancerClients 终于分析到了此注解的作用,它是实现不同服务之间的配置隔离的关键 Configuration(proxyBeanMethods false) Retention(RetentionPolicy.RUNTIME) Target({ ElementType.TYPE }) Documented Import(LoadBalancerClientConfigurationRegistrar…...
uniapp 左右滑动切换页面并切换tab
实现效果如图 要实现底部内部的左右滑动切换带动上方tab栏的切换,并且下方内容要实现纵向滚动 ,所以需要swiper,swiper-item,scroll-view组合使用 tab栏部分 <view class"tabs"><view class"tab_item" v-for&…...
FinClip 支持小程序维度域名配置;桌面端体验活动进行中
FinClip 的使命是使您(业务专家和开发人员)能够通过小程序解决关键业务流程挑战,并完成数字化转型的相关操作。不妨让我们看看在本月的产品与市场发布亮点,看看是否有助于您实现目标。 产品方面的相关动向👇…...
盘古信息PCB行业解决方案:以全域场景重构,激活智造新未来
一、破局:PCB行业的时代之问 在数字经济蓬勃发展的浪潮中,PCB(印制电路板)作为 “电子产品之母”,其重要性愈发凸显。随着 5G、人工智能等新兴技术的加速渗透,PCB行业面临着前所未有的挑战与机遇。产品迭代…...
React Native 开发环境搭建(全平台详解)
React Native 开发环境搭建(全平台详解) 在开始使用 React Native 开发移动应用之前,正确设置开发环境是至关重要的一步。本文将为你提供一份全面的指南,涵盖 macOS 和 Windows 平台的配置步骤,如何在 Android 和 iOS…...
Java 8 Stream API 入门到实践详解
一、告别 for 循环! 传统痛点: Java 8 之前,集合操作离不开冗长的 for 循环和匿名类。例如,过滤列表中的偶数: List<Integer> list Arrays.asList(1, 2, 3, 4, 5); List<Integer> evens new ArrayList…...
CentOS下的分布式内存计算Spark环境部署
一、Spark 核心架构与应用场景 1.1 分布式计算引擎的核心优势 Spark 是基于内存的分布式计算框架,相比 MapReduce 具有以下核心优势: 内存计算:数据可常驻内存,迭代计算性能提升 10-100 倍(文档段落:3-79…...
HBuilderX安装(uni-app和小程序开发)
下载HBuilderX 访问官方网站:https://www.dcloud.io/hbuilderx.html 根据您的操作系统选择合适版本: Windows版(推荐下载标准版) Windows系统安装步骤 运行安装程序: 双击下载的.exe安装文件 如果出现安全提示&…...
2025盘古石杯决赛【手机取证】
前言 第三届盘古石杯国际电子数据取证大赛决赛 最后一题没有解出来,实在找不到,希望有大佬教一下我。 还有就会议时间,我感觉不是图片时间,因为在电脑看到是其他时间用老会议系统开的会。 手机取证 1、分析鸿蒙手机检材&#x…...
html-<abbr> 缩写或首字母缩略词
定义与作用 <abbr> 标签用于表示缩写或首字母缩略词,它可以帮助用户更好地理解缩写的含义,尤其是对于那些不熟悉该缩写的用户。 title 属性的内容提供了缩写的详细说明。当用户将鼠标悬停在缩写上时,会显示一个提示框。 示例&#x…...
C# 求圆面积的程序(Program to find area of a circle)
给定半径r,求圆的面积。圆的面积应精确到小数点后5位。 例子: 输入:r 5 输出:78.53982 解释:由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982,因为我们只保留小数点后 5 位数字。 输…...
Android第十三次面试总结(四大 组件基础)
Activity生命周期和四大启动模式详解 一、Activity 生命周期 Activity 的生命周期由一系列回调方法组成,用于管理其创建、可见性、焦点和销毁过程。以下是核心方法及其调用时机: onCreate() 调用时机:Activity 首次创建时调用。…...
并发编程 - go版
1.并发编程基础概念 进程和线程 A. 进程是程序在操作系统中的一次执行过程,系统进行资源分配和调度的一个独立单位。B. 线程是进程的一个执行实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位。C.一个进程可以创建和撤销多个线程;同一个进程中…...
