因项目需要，只在某些特定树节点需要显示radio或checkbox选项，使用插槽进行自定义节点内容。简化代码如下：
极客观点
项目管理
HarmonyOS
<el-tree :data="treeData">
<template #default="{ data }">
<el-radio @click.stop="handleChange(val, evt)" v-model="data.checked">{{ data.label }}</el-radio>
<el-checkbox @click.stop="handleChange(val, evt)" v-model="data.checked">{{ data.label }}</el-checkbox>
</template>
</el-tree>问题：在点击radio或checkbox控件时会触发树节点的一次折叠。尝试在handleChange()内增加stopPropagation和preventDefault均不生效。求大佬们指点
AI BotBETA要在 Element UI 的 el-tree 组件中防止点击 radio 或 checkbox 触发节点折叠，你可以通过阻止事件冒泡来防止 el-tree 的节点折叠行为。在你的代码中，你已经尝试使用了 @click.stop 修饰符来阻止点击事件冒泡，这通常是正确的做法。然而，由于 v-model 的双向绑定可能会触发额外的更新和事件，这可能会导致节点折叠。
一种可能的解决方案是，不在 el-radio 和 el-checkbox 上直接使用 v-model，而是手动处理选中状态的变化。同时，确保在改变选中状态时不触发 el-tree 的折叠逻辑。
下面是一个修改后的代码示例：
<template>
<el-tree :data="treeData" @node-click="handleNodeClick">
<template #default="{ node, data }">
<el-radio
v-if="/* 根据某些条件判断是否需要显示 radio */"
:label="data.id"
:checked="node.checked"
@change="handleRadioChange(node, $event)"
>
{{ data.label }}
</el-radio>
<el-checkbox
v-else-if="/* 根据某些条件判断是否需要显示 checkbox */"
:label="data.id"
:checked="node.checked"
@change="handleCheckboxChange(node, $event)"
>
{{ data.label }}
</el-checkbox>
<span v-else>
{{ data.label }}
</span>
</template>
</el-tree>
</template>
<script>
export default {
data() {
return {
treeData: [/* 你的树数据 */],
};
},
methods: {
handleNodeClick(data) {
// 这里处理节点点击事件，如果需要的话
},
handleRadioChange(node, event) {
// 手动设置节点的选中状态，避免 v-model 触发额外的行为
node.checked = event.target.checked;
// 这里可以添加额外的逻辑，比如更新节点数据等
},
handleCheckboxChange(node, event) {
// 与 handleRadioChange 方法类似，处理 checkbox 的变化
node.checked = event.target.checked;
// 其他逻辑...
},
},
};
</script>在这个修改后的代码中，我们移除了 v-model 并使用了 @change 事件监听器来手动处理 radio 和 checkbox 的选中状态变化。这样，当你点击 radio 或 checkbox 时，只有这些控件的选中状态会改变，而不会触发 el-tree 的节点折叠行为。
注意：这个解决方案假设 node 对象有一个 checked 属性，你可以用它来跟踪节点的选中状态。你需要确保在初始化 treeData 时，每个节点都有一个 checked 属性，并且这个属性在树的状态改变时得到正确的更新。此外，你可能还需要在合适的地方（比如组件的 created 或 mounted 钩子中）初始化 treeData 以确保 checked 属性被正确设置。
试试 @click.native.stop 组件的方法有可能是 $emit 出来的，所以试试直接处理原始时间阻止冒泡。
还可以增加一个父级节点 div ，然后在 div 上阻止冒泡
