在一个文件中使用多个Vue组件
P粉710454910
P粉710454910 2023-11-22 21:55:43
[Vue.js讨论组]

在vue文档中,我在“脚本设置”指南中看到了“命名空间组件”,它写道:

您可以使用带点的组件标签(如 )来引用嵌套在对象属性下的组件。当您从单个文件导入多个组件时,这非常有用:

<script setup>
import * as Form from './form-components'
</script>

<template>
  <Form.Input>
    <Form.Label>label</Form.Label>
  </Form.Input>
</template>

我想知道在这个例子中表单组件是什么样子,以及这样一个组件的正确用例是什么,它与“slot”有什么关系。

P粉710454910
P粉710454910

全部回复(1)
P粉128563140

在本例中,form-components 引用了一个 .js 文件,该文件似乎正在导出单文件组件 (.vue) .

表单组件.js

export { default as Label } from './form-label.vue'
export { default as Input } from './form-input.vue'

然后您可以通过以下方式访问这些组件:

import * as Form from './form-components'

但是,我建议使用解构赋值 方法,因为 IDE 可以更好地解释它。

import { Input, Label } from './form-components'
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号