likes
comments
collection
share

我实现了Antd 右侧树形穿梭框

作者站长头像
站长
· 阅读数 103

Tree-to-Tree Transfer Component

Overview

在线示例:NetlifyVercel

我实现了Antd 右侧树形穿梭框

仓库:地址

本项目针对 Ant Design 官网Transfer 树形穿梭框组件进行扩展,演示左右侧树形穿梭框组件实现过程,解决右侧仅为列表视图的痛点。

左右两侧均为树形结构的穿梭框,使得能够在两个树形结构之间方便地进行节点的选择与转移,特别适用于需要在具有层级关系的数据集中进行交互操作的场景。

Features

  • 双树视图:创新性地在穿梭框的右侧也采用树形结构,便于直观管理和转移嵌套数据。
  • 完全自定义:除了Tree,仍可自定义其他需求组件。
  • 灵活配置:遵循 Antd 定义的规范类型,提供丰富的属性配置,轻松控制组件行为和样式。
  • 响应式设计:优化移动端体验,确保跨设备的无缝使用。

Getting Started

Prerequisites

确保您的开发环境已经安装了Node.jsnpm(或yarn)。

Setup

  1. 克隆本项目到本地。
git clone https://github.com/resetsix/Antd_Tree-to-Tree_Transfer.git
  1. 进入项目目录并安装依赖。
cd your-project-name

yarn # npm install
转载自:https://juejin.cn/post/7374984900372267044
评论
请登录