我有一個模板：
<template v-slot:title>
{{ $t('title') }}
</template>
和一個組件：
<v-col cols="12">
<h5 >
<slot name="title" />
</h5>
</v-col>
我只想<h4>為一個特定實體用標簽包裝插槽。我嘗試將它包裝在模板中，但沒有效果。如何交換包裹插槽的元素？
uj5u.com熱心網友回復：
您可以使用非強制性 prop 將您想要的標簽型別傳遞給組件，并根據傳遞的值將內容包裝到動態組件中（在示例中 h2、h3 和 h4 是正確的值）
在組件模板中：
<v-col cols="12">
<component :is="wrapper" :class="`text-${wrapper}`">
<slot name="title" />
</component>
</v-col>
在組件腳本中：
props: {
wrapper: {
type : String,
required : false,
default : 'h5',
validator: value => [ 'h2', 'h3', 'h4' ].includes(value)
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/339766.html