antdv 中 tree 组件

1. 介绍

ant-design-vue (4.1.2) 中的 tree 组件

2. 再次点击取消选中状态

代码：

<template>
  <a-tree
    v-model:selectedKeys="selectedKeys"
    @select="handleSelect"
  >
    
  </a-tree>
</template>
<script>
export default {
  data() {
    return {
      selectedKeys: [],
    };
  },

  methods: {
    handleSelect(selectedKeys, options) {
      const { selected, node: { dataRef } } = options;

      // 禁止 “再次点击，取消选中状态”
      if (!selected) {
        const nodeKey = dataRef.id;
        this.selectedKeys = [nodeKey];
      }
    },
  },
};
</script>

参考：

• 解决ant tree再次点击取消选中 (opens new window)