如何解决带有道具的 vuejs 嵌套插槽不会放下
我想将道具“multi”从 vDropdownSelection 下推到“vOptions”。如果不在每个选项上添加“:multi”,我该怎么做?我试过 slotprops 但它不起作用...
这是我的设置。
<!-- root -->
<vDropdownSelection :multi="true">
<vOption id="dd5" label="Choose me" />
<vOption id="dd6" label="No take me" />
<vOption id="dd7" label="I don't care..."/>
</vDropdownSelection>
multi 变为 true
//vDropdownSelection
<template>
<vPopOver>
<template #trigger="{ click }">
<button @click.prevent="click">{{ label }}</button>
</template >
<template #default>
<vSelectGroup :multi="multi" #default="{multi}">
{{ multi }} // shows true
<slot :multi="multi"/> // cannot pass multi ´
</vSelectGroup>
</template>
</vPopOver>
</template>
<script>
export default {
props: {
multi: {
type: Boolean,default: false
}
}
}
</script>
multi 变为 true
//vSelectGroup
<template>
<div>
<slot :multi="multi"/>
</div>
</template>
<script>
export default {
props: {
multi: {
type: Boolean,default: false
}
}
}
</script>
multi 仍然是假的...
// options
<template>
<div>
<input :type="isType">
<label>{{ label }}</label>
</div>
</template>
<script>
export default {
props: {
multi: {
type: Boolean,default: false
}
},computed: {
isType() {
return this.multi ? 'checkBox' : 'radio'
}
}
}
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。