iview tree控件每次选中,显示选中的id
时间: 2024-03-01 20:51:43 浏览: 23
好的,针对你的问题,你可以在iview tree控件的on-select事件中获取选中的节点的id并显示。具体代码可以参考以下示例:
```html
<template>
<div>
<Tree :data="data" @on-select="handleSelect"></Tree>
<div>选中节点的id为: {{selectedId}}</div>
</div>
</template>
<script>
export default {
data() {
return {
data: [
{
title: '节点1',
id: 1,
children: [
{ title: '节点1-1', id: 2 },
{ title: '节点1-2', id: 3 }
]
},
{
title: '节点2',
id: 4,
children: [
{ title: '节点2-1', id: 5 },
{ title: '节点2-2', id: 6 }
]
}
],
selectedId: ''
}
},
methods: {
handleSelect(node) {
this.selectedId = node.id;
}
}
}
</script>
```
在上面的代码中,我们在iview tree控件的`on-select`事件中获取选中的节点,并将该节点的id赋值给`selectedId`变量。然后我们在页面上显示该变量的值即可。