解析 Vue3 语法糖中的 “ 命名空间组件“ 到底是什么东西
创始人
2025-05-31 17:23:24
0次

解析 " 命名空间组件" 到底是什么东西

  • 前言
  • 一、命名空间组件是什么？
  • 二、分析理解
    • 1.从单个文件中导入多个组件 -- 分别引入
    • 2.从单个文件中导入多个组件 -- 使用命名空间的方式引入
  • 总结

前言

在使用 Vue3 的过程当中, 在学习语法糖的时候,发现了 命名空间组件这个名词,在此之前并未了解过,来浅浅的研究一下 ~

一、命名空间组件是什么？

以下介绍来自官方文档
在这里插入图片描述

二、分析理解

1.从单个文件中导入多个组件 – 分别引入

首先创建三个组件 : componentA , componentb , componentC

在这里插入图片描述
创建一个 child.js 引入这三个组件并抛出

// child.js// 引入组件
import ComponentA from './componentA.vue'
import ComponentB from './ComponentB.vue'
import ComponentC from './ComponentC.vue'
// 抛出组件
export {ComponentA,ComponentB,ComponentC
}

在父组件中引入 child.js ,并使用 child.js 中的三个组件




// father.vue

这时候页面中的效果如下
在这里插入图片描述

2.从单个文件中导入多个组件 – 使用命名空间的方式引入

代码如下（示例）：

此处的效果是一样的 ~ ! !

在这里插入图片描述

总结

使用 命名空间组件 的引入组件的方式方便之处就是如果需要引入一个文件中的多个组件,就不用一个一个引入了,可以 import * as Xxx from 'xxx' 将整个文件引入
antdesign 中已经有这样的用法了,组件之间的关系更加明确,有一个相同父级

前提
使用命名空间组件是有前提的 ! : 必须是 Vue3 中 setup 语法糖 的格式才可以使用,直接在 Vue3 中使用是不生效的 (有看到文章中说必须是 Vue3+ ts ,我在 Vue3 setup script 语法糖中不使用 ts 的情况下试了试,是可以的)
不使用 Vue3 语法糖的方式,会有 warn 并且页面中不展示内容了
在这里插入图片描述在这里插入图片描述

在这里插入图片描述

词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：关于安卓颜色选择器的使用（一）

下一篇：kali内置超好用的代理工具proxychains

相关内容

热门资讯

在大吉订购APP订购交易亏损被... 　　近期，不少投资者反映在“大吉订购App”上投资白银、铂金等商品遭遇严重亏损。该平台宣称提供现货订...
铂银壹号APP商品订购交易亏损... 　　许多中小投资者误以为网上的“商品现货订购”是合规合法的理财渠道，殊不知这背后隐藏着巨大的合规风险...
兴鑫淘金APP贵金属订购交易亏... 　　白银、贵金属或其他商品类投资，除国家批准的正规期货交易场所及持牌期货公司外，市面上大量第三方交易...
铂银掘金APP无资质的违规平台... 　　铂银掘金等平台的投资者，往往是被“注册送现金”“充值返现券”“首单免亏”等广告话术吸引，进而下载...
八方淘金APP订购交易不合规，... 　　“八方淘金APP”“铂银掘金APP”“铂银壹号APP”等软件被指以“现货订购”为名，实际采用高杠...
在指尖订购APP订购商品亏损被... 　　指尖订购APP这类平台，表面是“订购交易”，实则是披着电商外衣的非法期货陷阱。绝大多数投资者被蒙...
在犀贝易购APP做商品订购交易... 　　市面上打着“现货投资”“贵金属交易”旗号的APP并不少，但真正合规、受监管的平台并不多。犀贝易购...
易达淘金APP虚假商品订购交易... 　　易达淘金APP存在严重的虚假宣传与违规交易行为。该平台打着“商品订购”的旗号，实则通过不合规的交...
大浪淘金APP白银订购亏损被骗... 　　大浪淘金APP最隐蔽的套路，在于其完全封闭的内盘交易系统。表面上，它宣称与国际贵金属市场接轨；实...
一品好购APP上订购白银出现亏... 　　一品好购APP原名“一品订购”，运营方为上海宝智未来信息技术有限公司。近期不少投资者反映在该平台...
九州订购APP贵金属订购投资骗... 　　九州订购APP正通过抖.音、快手、今日头条等平台大量投放投资广告，用“5元起投”“充值返现”“0...
坚锅淘金APP交易软件并不正规... 　　当前，市面上大量所谓的“现货商城订购”交易软件，早已偏离了正常的实物商品买卖，演变为高杠杆、高手...
斗金订购APP贵金属期货交易骗... 　　斗金订购APP的投资者往往被铺天盖地的广告宣传所诱导——注册即送现金、充值返现券等看似诱人的福利...
警惕！云启购APP违规经营，披... 　　"5元起投、充值返现、稳赚不赔"——这些诱人的广告语背后，可能是一个精心设计的金融陷阱。　　近期...
量子淘金APP贵金属投资不合规... 　　"4元起投""充值返券""月入过万"——这些极具诱惑力的广告语在短视频平台、社交软件上铺天盖地。...
鑫汇智投APP贵金属商品订购骗... 　　鑫汇智投APP非法期货投资骗局，受害者在投资过程中根本不懂交易，也不去研究和验证这个平台是否正规...
矅光智策APP平台违规经营非法... 　　矅光智策APP对外宣称是“商城订购”“现货交易”，但查询其经营范围，并未显示具备开展现货期货交易...
黄金珠宝怎么选？内侧刻字都代表... 潮新闻客户端 记者 马焱 通讯员 任倩影 9月8日下午，“云游杭州 乐购金秋”——“浙城·浙放心”活...
原创 冰... 最近全球国债市场正在上演魔幻一幕： 美债、日债、欧债遭遇猛烈抛售，收益率冲到几十年新高，美国财政部都...
日韩股市开盘表现分化 上证报中国证券网讯 9月9日，日韩股市开盘表现分化，韩国综合指数开盘上涨0.26%，报6972.87...