js使用递归,循环树形结构数据

今天在项目中遇到一个这样的问题,需要给树形结构的数据中加一个属性,其实很简单
上代码吧

// data中定义数据
treeData = [{
	key: 'num',
	title: '指标编号',
	children:[{
		key: 'num',
		title: '指标编号',
		children:[{
			key: 'num',
			title: '指标编号',
			children:[{
				key: 'num',
				title: '指标编号',
			}]
		}]
	}]
},
{
	key: 'num',
	title: '指标编号',
	children:[{
		key: 'num',
		title: '指标编号',
		children:[{
			key: 'num',
			title: '指标编号',
			children:[{
				key: 'num',
				title: '指标编号',
			}]
		}]
	}]
}]

现在呢我想给每个里面加一个width的属性,就是动态加一个宽度
现在开始搞他吧 盘他
1，

matterTree(data) {
  for (var i = 0; i < data.length; i++) {
    // 这里面就是你处理数据的地方 
    data[i].width = '200'
    if (data[i].children && data[i].children.length > 0) {
      // children若不为空数组，则继续 递归调用 本方法
      this.matterTree(data[i].children)
    }
  }
  return data
},

其实感觉就是加一个递归循环,而递归循环呢,难点就是怎么走出循环,处理不好就会造成一个死的循环了,
自己试一下吧 挺有意思的,
2，用reduce也是可以的

flatten(arr) {  
    return arr.reduce((result, item)=> {
        return result.concat(Array.isArray(item) ? this.flatten(item) : item);
    }, []);
}

//变一下

fnTree (arr) {//取树状数据的所有子集
 return arr.reduce((prev, cur) => {
   return prev.concat(cur.children&&cur.children.length ? this.fnTree(cur.children) : cur )
 }, [])
},