对 ant design vue的组件<a-select>和他嵌套的子项<a-select-option>进行二次封装 修改名字并导出自己的组件,在使用的时候报警告 Warning: the children of Select
should be Select.Option
or Select.OptGroup
, instead of CtsSelectOption
,这是怎么回事啊,对于这种嵌套的有子项的应该怎么封装呢??
<Select.Option
v-bind="$attrs"
v-on="$listeners"
:value="value"
:title="title"
>
<slot
v-for="(_, slotName) in $slots"
:name="slotName"
:slot="slotName"
></slot>
<template
v-for="(_, slotName) in $scopedSlots"
:slot="slotName"
slot-scope="slotProps"
>
<slot :name="slotName" v-bind="slotProps"></slot>
</template>
</Select.Option>
</div>
</template>
<script>
import Vue from "vue";
import { Select } from "ant-design-vue";
// const Option = Select.Option;
Vue.use(Select);
export default {
name: "CtsSelectOption",
components: { "Select.Option": Select.Option },
props: {
value: String,
title: String,
},
data() {
return {};
},
methods: {},
};
</script>
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…