动态渲染antd树形控件，报Uncaught RangeError: Maximum call stack size exceeded解决方法

根据官方api可知，树形控件接口需要满足如下格式

 treeData = [
  {
    title: '0-0',
    key: '0-0',
    children: [
      {
        title: '0-0-0',
        key: '0-0-0',
        children: [
          { title: '0-0-0-0', key: '0-0-0-0' },
          { title: '0-0-0-1', key: '0-0-0-1' },
          { title: '0-0-0-2', key: '0-0-0-2' },
        ],
      },
      {
        title: '0-0-1',
        key: '0-0-1',
        children: [
          { title: '0-0-1-0', key: '0-0-1-0' },
          { title: '0-0-1-1', key: '0-0-1-1' },
          { title: '0-0-1-2', key: '0-0-1-2' },
        ],
      },
      {
        title: '0-0-2',
        key: '0-0-2',
      },
    ],
  },
  {
    title: '0-1',
    key: '0-1',
    children: [
      { title: '0-1-0-0', key: '0-1-0-0' },
      { title: '0-1-0-1', key: '0-1-0-1' },
      { title: '0-1-0-2', key: '0-1-0-2' },
    ],
  },
  {
    title: '0-2',
    key: '0-2',
  },
]

此时，我们通过接口请求返回回来的数据可进行此数据结构进行组装，比如我接口返回的数据格式是不含有key和title及children的，就需要组装成下列结构

具体组装函数如下

一、传统for循环方式

for (let f = 0, fl = res.data.length; f < fl; f++) {
				let item = res.data[f]
				if (item.pId === 0) { // first
					item.children = []
					item.title = item.name
					item.key = item.id
					first.push(item)
					continue // ！！！！注意
				}
				for (let s = 0, sl = first.length; s < sl; s++) {
					let sItem = first[s]
					if (item.pId === sItem.id) { // second
						item.children = []
						item.title = item.name
						item.key = item.id
						second.push(item)
						sItem.children.push(item)
					}
				}
				for (let t = 0, tl = second.length; t < tl; t++) {
					let tItem = second[t]
					if (tItem.id == item.pId) { // third
						item.title = item.name
						item.key = item.id
						tItem.children.push(item)
					}
				}
			}

二、使用forEach方式遍历

			res.data.forEach(item => {
				if (item.pId === 0) { // first
					item.children = []
					item.title = item.name
					item.key = item.id
					treeData.push(item)
					return // 改为return
				}
				treeData.forEach(f => {
					if (item.pId === f.id) { // second
						item.children = []
						item.title = item.name
						item.key = item.id
						second.push(item)
						f.children.push(item)
					}
				})
				second.forEach(s => {
					if (s.id == item.pId) { // third
						item.title = item.name
						item.key = item.id
						s.children.push(item)
					}
				})
			})

注意 多层循环时，一定要有跳出循环的条件，否则会报栈溢出！！！，因此在第一层满足条件时加continue或return

数据组装完后，根据官网的树形控件，即可渲染成功