用户2883797
用户2883797
  • 发布:2025-09-07 18:30
  • 更新:2025-09-07 18:30
  • 阅读:16

递归组件的插槽问题

分类:uni-app
tree组件 <scroll-view class="tree-container" scroll-y> <tree-node class="tree-node" v-if="filteredTreeData.length" v-for="(e, i) in filteredTreeData" first-node="i == 0" key="e[fieldNames.key]" node="e" level="0" field-names="fieldNames" selected-keys="selectedKeys" half-selected-keys="halfSelectedKeys" expanded-keys="expandedKeys" @select-change="handleSelectChange"
@toggle-expand="handleToggleExpand"
>
<template #node="{ data }">
<slot name="node" :data="data" />
</template>
</tree-node>
<up-empty v-else mode="data" style="margin-block: 30rpx" />
</scroll-view>
tree-node组件
<template>
<view class="tree-node" :class="firstNode && 'first-tree-node'">
<view class="node-content" :style="{ paddingLeft: level * 36 + 'rpx' }">
<!-- 节点标题 -->
<view class="node-label" :class="'text_ellipsis'" @click="handleSelect">
<slot name="node" :data="node">
{{ node[fieldNames.title] }}
</slot>
</view>
</view>
</view>
<!-- 子节点 -->
<template v-if="isExpanded && hasChildren">
<tree-node
v-for="child in node[fieldNames.children]" key="child[fieldNames.key]" node="child" level="level + 1" field-names="fieldNames" selected-keys="selectedKeys" half-selected-keys="halfSelectedKeys" @select-change="$emit('select-change', $event)"
@toggle-expand="$emit('toggle-expand', $event)"
>
<template #node="{ data }">
<slot name="node" :data="data" />
</template>
</tree-node>
</template>
</template>
功能完全正常,但是使用插槽自定义节点内容时就会出问题,报错More than one slot named "node-0" are found inside a single component instance (in component "components/Tree/index"). The first one was accepted. More than one slot named "node-0" are found inside a single component instance (in component "components/Tree/tree-node"). The first one was accepted.,只会插入成功一个
2025-09-07 18:30 负责人:无 分享
已邀请:

要回复问题请先登录注册