【vue3】setup语法糖 - 命名空间组件

把多个组件引入一个js文件内再抛出之后引入使用

第一步：

创建文件夹，创建用到的组件文件和引入的js文件

第二步：

import 引入组件，export 抛出组件

index.js

// 引入多个组件
import Label from "./label.vue"
import List from "./list.vue"
import Tab from "./tab.vue"

// 抛出组件
export {
    Label, List, Tab
}

页面使用：

<script setup name="com">
    // 引入多组件所在的index.js文件
    import * as Com from '@/components/com'
</script>

//模板中使用
<template>
    <Com.List></Com.List>
    <Com.Tab></Com.Tab>
</template>

好用的地方就是

        页面使用的组件多的话不用引入多个组件那么麻烦了

        粘贴复制不需要改代码了，就引入一个js就可以使用你放进文件内的组件们~

啊哈哈哈~~~   <(*￣▽￣*)/