treeselect组件选中父节点时获取子节点的id

HTML:

<template>
  <div>
    <treeselect
      :options="treeData"
      @select="handleSelect"
      placeholder="请选择"
    />
  </div>
</template>

JavaScript:

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  components: { Treeselect },
  data() {
    return {
      treeData: [
        {
          id: 1,
          label: "父节点",
          children: [
            { id: 2, label: "子节点1" },
            { id: 3, label: "子节点2" },
            { id: 4, label: "子节点3" },
          ],
        },
        // 其他节点
      ],
    };
  },
  methods: {
    handleSelect(selectedNode) {
      if (selectedNode.children) {
        const childIds = selectedNode.children.map((childNode) => childNode.id);
        console.log("子节点 ID:", childIds);
      }
    },
  },
};

猜你喜欢

转载自blog.csdn.net/qq_43314341/article/details/130811822