赞
踩
在使用子组件的具名插槽时,但是在某些条件下,使用自己传入的具名插槽内容或者使用该子组件的插槽的默认内容
一个demo
<template> <Son3> <template #[slotName]> <div> 12331232 </div> </template> </Son3> </template> </Son3> </template> <script setup lang='ts'> import { ref } from 'vue' const slotName = ref('aaa') setTimeout(() => { slotName.value === 'test' }, 3000); </script> <style lang="scss" scoped> </style>
<template>
<slot name="test">默认内容</slot>
</template>
<script setup lang='ts'></script>
<style lang="scss" scoped>
</style>
实现原理:利用使用子组件插槽的name可以动态变化,若满足条件就设置为正确的name,否则就设置其他不存在的name
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。