Vue3使用antd Vue树形控件实现点击生成自定义结构

最新推荐文章于 2024-03-28 09:45:29 发布

VIP文章 KyleZhou_

最新推荐文章于 2024-03-28 09:45:29 发布

阅读量1.9k

点赞数

分类专栏： antd Vue 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_38949279/article/details/126288642

版权

1.了解到TreeNode节点的三个属性，title，key，children[]

2.反复构造节点，那么响应式就用到Vue3中的基础知识

3.右击楼宇-生成楼层选项，点击楼层-生成房间选项

      <div class="createTree">
        <a-tree
          v-model:selectedKeys="selectedKeys"
          :tree-data="treeData"
          show-line
          right-click="clickRightClick"
          :default-expand-all="true"
        >
          <template #title="{ title, key: treeKey, children }">
            <!-- 0    0-0    0-0-0 -->
            <a-dropdown :trigger="['contextmenu']">
              <span>{
  { title }}</span>
              <template #overlay>
                <a-menu @click="({ key: menuKey }) => onContextMenuClick(treeKey, menuKey, children)">