Ant Design:树形表格

简介: Ant Design:树形表格

Table组件表格支持树形数据的展示,当行数据拥有children字段时会自动展示为树形表格。


  • 在数据列表项中添加children数组,该数组为该行数据的子项。例如:
const list = [
  {
    key: 1,
    name: 'John Brown sr.',
    age: 60,
    address: 'New York No. 1 Lake Park',
    children: [
      {
        key: 11,
        name: 'John Brown',
        age: 42,
        address: 'New York No. 2 Lake Park',
      },
      {
        key: 12,
        name: 'John Brown jr.',
        age: 30,
        address: 'New York No. 3 Lake Park',
        children: [
          {
            key: 121,
            name: 'Jimmy Brown',
            age: 16,
            address: 'New York No. 3 Lake Park',
          },
        ],
      },
      {
        key: 13,
        name: 'Jim Green sr.',
        age: 72,
        address: 'London No. 1 Lake Park',
        children: [
          {
            key: 131,
            name: 'Jim Green',
            age: 42,
            address: 'London No. 2 Lake Park',
            children: [
              {
                key: 1311,
                name: 'Jim Green jr.',
                age: 25,
                address: 'London No. 3 Lake Park',
              },
              {
                key: 1312,
                name: 'Jimmy Green sr.',
                age: 18,
                address: 'London No. 4 Lake Park',
              },
            ],
          },
        ],
      },
    ],
  },
]

相关文章
antd-procomponent中编辑表格动态数据设置的使用
antd-procomponent中编辑表格动态数据设置的使用
648 0
|
前端开发 C#
WPF MVVM中在ViewModel中关闭或者打开Window
原文:WPF MVVM中在ViewModel中关闭或者打开Window 这篇博客将介绍在MVVM模式ViewModel中关闭和打开View的方法。 1. ViewModel中关闭View public class MainViewModel { publi...
3705 0
|
缓存 资源调度 Rust
前端效率提升实践之路
在一个B端前端项目中,开发团队面临开发效率低、交付质量和可维护性差的问题。为了解决这些问题,他们以“提效”为主题,展开了项目治理。首先,他们优化了发布和编译过程,通过更换包管理工具、减少不必要的包、使用缓存策略等方法,显著缩短了发布和编译时间。其次,团队致力于沉淀可复用物料,创建了高度配置化的组件,通过VSCode插件助手自动化配置,提高了代码复用性和开发效率。此外,他们还改进了研发流程,制定了前端、后端和产品的规范,以减少沟通成本和提高接口质量。通过这些措施,团队成功提升了开发效率,并降低了代码维护成本。
528 3
前端效率提升实践之路
|
Prometheus 监控 Cloud Native
Grafana 最全详解 ( 图文全面总结 )
Grafana是非常重要的微服务部署监控工具,被广泛应用于大型网站架构,本文全面详解。关注【mikechen的互联网架构】,10年+BAT架构经验倾囊相授。
Grafana 最全详解  ( 图文全面总结 )
|
NoSQL 前端开发 Redis
Windows 下安装和配置 Redis (图文教程)
Windows 下安装和配置 Redis (图文教程)
hutool获取excel中的图片
hutool获取excel中的图片
969 1
|
JSON JavaScript 定位技术
Echarts 绘制地图(中国、省市、区县),保姆级教程!
Echarts 绘制地图(中国、省市、区县),保姆级教程!
|
人工智能 安全 搜索推荐
AI代码生成器——CodeWhisperer
【2月更文挑战第16天】AI代码生成器——CodeWhisperer
490 2
AI代码生成器——CodeWhisperer
|
关系型数据库 MySQL 数据库
idea如何连接数据库
idea如何连接数据库

热门文章

最新文章