敲木鱼的猪猪侠
敲木鱼的猪猪侠
  • 发布:2024-09-12 11:09
  • 更新:2024-09-12 11:09
  • 阅读:102

【报Bug】动态名称插槽父组件未显示定义默认插槽则插槽内容无效

分类:uni-app

产品分类: uniapp/小程序/微信

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win10

HBuilderX类型: 正式

HBuilderX版本号: 4.24

第三方开发者工具版本号: 1.06.2405020

基础库版本号: 3.4.9

项目创建方式: HBuilderX

示例代码:

父组件 start =====================================================

<script setup>
import { ref, watch, computed, watchEffect, onMounted, onUnmounted, toValue } from "vue";
import TestSub from "./components/test-sub.vue";
defineOptions({
name: "Test",
});
const props = defineProps({});

const options = ref([
{
label: "选项1",
prop: "slot1",
},
{
label: "选项2",
prop: "slot2",
},
{
label: "选项3",
prop: "slot3",
},
]);
</script>
<template>
<view class="test">
<view class="">测试环境</view>
<TestSub :options="options">
<!-- <template v-slot:default> </template> -->
<template v-slot:slot1>
<view>slot1插槽内容</view>
</template>
<template v-slot:slot2>
<view>slot2插槽内容</view>
</template>
<template v-slot:slot3>
<view>slot3插槽内容</view>
</template>
</TestSub>
</view>
</template>
<style lang="scss">
.test {
}
</style>

父组件 end =====================================================

子组件 start =====================================================
<script setup>
import { ref, watch, computed, watchEffect, onMounted, onUnmounted, toValue } from "vue";

defineOptions({
name: "TestSub",
});
const props = defineProps({
options: {
type: [Array, Object],
default: () => [],
},
});
</script>
<template>
<view class="test-sub">
<view>子组件</view>
<template v-for="(item, index) in options" :key="index">
<view class="">
<slot :name="item.prop">
{{ item.prop }}
</slot>
</view>
</template>
</view>
</template>
<style lang="scss">
.test-sub {
}
</style>

子组件 end =====================================================

操作步骤:

<!-- <template v-slot:default> </template> --> 这代码注释放开正常, 注释错误

预期结果:

动态名称插槽内容应该替换后备内容

实际结果:

动态名称插槽内容没渲染出来

bug描述:

动态名称插槽父组件未显示定义默认插槽则插槽内容无效

2024-09-12 11:09 负责人:无 分享
已邀请:

要回复问题请先登录注册