在一個檔案中使用多個Vue元件
P粉710454910
P粉710454910 2023-11-22 21:55:43
0
1
629

在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'
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板