樹狀圖是一種常用的數據展示方式，而樹狀圖中樹節點的選中狀態也是一個非常重要的功能。在使用Vue構建樹狀圖組件時，我們需要實現樹節點的選中事件。

<template>
<div>
<tree-node v-for="node in nodes" :node="node" :key="node.id" @check="checkNode"></tree-node>
</div>
</template>
<script>
import TreeNode from './TreeNode.vue'
export default {
components: {
TreeNode
},
data() {
return {
nodes: [
{
id: 1,
label: '根節點',
children: [
{
id: 2,
label: '節點1'
},
{
id: 3,
label: '節點2'
}
]
}
]
}
},
methods: {
checkNode(node) {
console.log(node)
}
}
}
</script>

上面的代碼是一個基本的樹狀圖組件，我們使用v-for指令來遍歷節點，使用tree-node組件來渲染每個節點。我們通過@check事件來監聽節點的選中操作，當節點選中時，checkNode方法會被觸發。

<template>
<div class="tree-node" :class="{active: isSelected}" @click="handleClick">
<span>{{node.label}}</span>
<ul v-if="node.children">
<tree-node v-for="child in node.children" :node="child" :key="child.id" @check="$emit('check', $event)"></tree-node>
</ul>
</div>
</template>
<script>
export default {
props: {
node: {
type: Object,
required: true
}
},
data() {
return {
isSelected: false
}
},
methods: {
handleClick() {
this.isSelected = !this.isSelected
this.$emit('check', this.node)
}
}
}
</script>

上面的代碼是tree-node組件的代碼，我們給每個節點綁定了點擊事件，當節點被點擊時，handleClick方法會被觸發。我們在選中節點時給該節點添加active類名，并觸發@check事件傳遞當前節點數據。

通過以上的代碼示例，我們可以輕松地實現Vue樹選中事件。當然，實際情況可能更加復雜，我們需要結合實際需求進行相應的修改。