antd YApi 使用Tree组件改造API目录 (二级目录改造成无限级)

import React, { Component } from 'react'
import { Tree,Icon } from 'antd';
import axios from 'axios';
const { TreeNode } = Tree;


export default class Tree3 extends Component {
  state = {
    gData:[],
    expandedKeys: [],
  }
  componentDidMount(){
    axios.get('http://10.26.21.83:3000/mock/91/openapi/doc/queryMenu').then(res=>{
      console.log(res.data)
      this.setState({
        gData:res.data.data
      })
    })
  }

  render() {
    let d = this.state.gData
    const loop = data => data.map((item) => {
      if (item.itemType === 'cat') { //一级目录
        return <TreeNode key={'cat_' + item._id} title={item.name || item.title}>{loop(item.list)}</TreeNode>;
      }else if(item.record_type === 2) { //文件夹类型
        return  (
          <TreeNode
            className={`interface-item-nav2`}
            title={
              <div className="container-title">
                <div className="interface-item" onClick={e => e.stopPropagation()}>
                  <Icon type="folder-open" style={{ marginRight: 5 }} />
                  {item.title || item.name}
                </div>
              </div>
            }
            key={'cat_' + item._id}
          >
            {item.list && loop(item.list)}
          </TreeNode>)
      }else{
        return ( //文档 api类型
          <TreeNode
            className={`interface-item-nav3`}
            title={
              <div className="container-title">{item.title || item.name}</div>
            }
            key={'' + item._id}
          />);
      }
    });
    return (
      <Tree
        className="draggable-tree"
        defaultExpandedKeys={this.state.expandedKeys}
        blockNode
      >
        {loop(d)}
      </Tree>
    );
  }
}

数据结构：

{
  "errcode": 0,
  "errmsg": "成功！",
  "data": [
    {
      "index": 0,
      "_id": 97,
      "name": "公共分类",
      "project_id": 15,
      "desc": "公共分类",
      "uid": 11,
      "add_time": 1557311308,
      "up_time": 1557311308,
      "__v": 0,
      "itemType": "cat",
      "list": [
        {
          "edit_uid": 0,
          "status": "undone",
          "parent_id": null,
          "record_type": 0,
          "interface_type": "dubbo",
          "index": 0,
          "tag": [],
          "_id": 192,
          "catid": 97,
          "title": "getRoleHouseInfos",
          "r_facade": "com.lianjia.mls.datakeeper.housedel.facade.search.customer.Search4CustomerFacade",
          "r_method": "getRoleHouseInfos",
          "method": "GET",
          "project_id": 15,
          "uid": 11,
          "add_time": 1557372229,
          "up_time": 1557372229,
          "list": []
        },
        {
          "edit_uid": 0,
          "status": "undone",
          "parent_id": null,
          "record_type": 0,
          "interface_type": "http",
          "index": 1,
          "tag": [],
          "_id": 211,
          "method": "GET",
          "catid": 97,
          "title": "menu",
          "path": "/api/interface/list_menu",
          "project_id": 15,
          "uid": 11,
          "add_time": 1557390072,
          "up_time": 1557397650,
          "list": []
        },
        {
          "edit_uid": 11,
          "status": "undone",
          "parent_id": null,
          "record_type": 1,
          "interface_type": "http",
          "index": 1,
          "tag": [],
          "_id": 220,
          "title": "wiki目录",
          "catid": 97,
          "project_id": 15,
          "uid": 11,
          "add_time": 1557456457,
          "up_time": 1557457632,
          "list": []
        },
        {
          "edit_uid": 0,
          "status": "undone",
          "parent_id": null,
          "record_type": 2,
          "interface_type": "http",
          "index": 3,
          "tag": [],
          "_id": 271,
          "title": "tree2",
          "catid": 97,
          "project_id": 15,
          "uid": 11,
          "add_time": 1557900913,
          "up_time": 1557900913,
          "list": [
            {
              "edit_uid": 0,
              "status": "undone",
              "parent_id": "271",
              "record_type": 0,
              "interface_type": "http",
              "api_opened": false,
              "index": 0,
              "tag": [],
              "_id": 278,
              "method": "GET",
              "catid": 97,
              "title": "更新或插入接口的富文本2",
              "path": "/openapi/doc/queryAllTabs2",
              "project_id": 15,
              "uid": 11,
              "add_time": 1557900943,
              "up_time": 1557900943
            }
          ]
        },
        {
          "edit_uid": 0,
          "status": "undone",
          "parent_id": null,
          "record_type": 2,
          "interface_type": "http",
          "index": 4,
          "tag": [],
          "_id": 190,
          "title": "tree",
          "catid": 97,
          "project_id": 15,
          "uid": 11,
          "add_time": 1557370827,
          "up_time": 1557370827,
          "list": [
            {
              "edit_uid": 0,
              "status": "undone",
              "parent_id": "190",
              "record_type": 0,
              "interface_type": "http",
              "api_opened": false,
              "index": 0,
              "tag": [],
              "_id": 191,
              "method": "GET",
              "catid": 97,
              "title": "更新或插入接口的富文本",
              "path": "/openapi/doc/insertOrUpdateApiText",
              "project_id": 15,
              "uid": 11,
              "add_time": 1557370838,
              "up_time": 1557370838
            },
            {
              "edit_uid": 0,
              "status": "undone",
              "parent_id": "190",
              "record_type": 1,
              "interface_type": "http",
              "api_opened": false,
              "index": 2,
              "tag": [],
              "_id": 193,
              "title": "tree2",
              "catid": 97,
              "project_id": 15,
              "uid": 11,
              "add_time": 1557373422,
              "up_time": 1557818144
            },
            {
              "edit_uid": 0,
              "status": "undone",
              "parent_id": "190",
              "record_type": 2,
              "interface_type": "http",
              "api_opened": false,
              "index": 3,
              "tag": [],
              "_id": 285,
              "title": "treeChild2",
              "catid": 97,
              "project_id": 15,
              "uid": 11,
              "add_time": 1557900967,
              "up_time": 1557900967,
              "list": [
                {
                  "edit_uid": 0,
                  "status": "undone",
                  "parent_id": "285",
                  "record_type": 1,
                  "interface_type": "http",
                  "api_opened": false,
                  "index": 0,
                  "tag": [],
                  "_id": 292,
                  "title": "h3目录",
                  "catid": 97,
                  "project_id": 15,
                  "uid": 11,
                  "add_time": 1557902644,
                  "up_time": 1557902644
                }
              ]
            }
          ]
        },
        {
          "edit_uid": 0,
          "status": "undone",
          "parent_id": null,
          "record_type": 0,
          "interface_type": "http",
          "index": 5,
          "tag": [],
          "_id": 189,
          "method": "GET",
          "catid": 97,
          "title": "创建目录",
          "path": "/api/interface/add",
          "project_id": 15,
          "uid": 11,
          "add_time": 1557370124,
          "up_time": 1557370124,
          "list": []
        }
      ]
    }
  ]
}

结果：