结合数据转换数组

Question

 var data = [
      {type: '水果',enName: 'fruits', children:[{name: 'apple', number: 16},{name: 'pare', number: 13},{name: 'banana', number: 10}] },
      {type: '蔬菜',enName: 'vegetables', children:[{name: 'tomato', number: 5},{name: ' potato', number: 6}] },
      {type: '饮料',enName: 'drinks', children:[{name: 'juice', number: 2},{name: ' milk', number: 4}, {name: 'lemonTea', number: 1}]}
    ]
 var arr = [
      { row: 0, col: 0, rowspan: 3, colspan: 1 },
      { row: 0, col: 1, rowspan: 3, colspan: 1 },

      { row: 4, col: 0, rowspan: 2, colspan: 1 },
      { row: 4, col: 1, rowspan: 2, colspan: 1 },

      { row: 7, col: 0, rowspan: 3, colspan: 1 },
      { row: 7, col: 1, rowspan: 3, colspan: 1 }
    ]

根据data的数据生成数组arr：
arr数组中，第一项和第二项 的row,都是0，rowspan等于数据data中第一个子对象的children的length 3，然后 arr数组中，第三项和第四项 的row 是相对于数据data中第一个子对象的children的length： 3 的基础上加 1，是4， 第三项和第四项的rowspan等于数据data中第二个子对象的children的length: 2，然后 arr数组中，第五项和第六项 的row 是相对于数据data中第一个子对象的children的length的基础上加1和data中第二个子对象的children的length加1，两者相加得到的 7，第五和第六项的rowspan 就是data数据中第三个子对象children的length，
以此类推，可能data 中还有第四或第五个子对象， 而arr就会根据data中的每增加一个子对象 而增加两项....请教下 有什么比较好的方法来转换

Answer 1

// data是你提供的数据
const result = data.reduce((arr, item, index) => {
    let rowspan = item.children && item.children.length || 0
    let currRow = data.reduce((total, item, subIndex) => {
        if (subIndex < index) {
            let len = item.children && item.children.length || 0
            total += len + 1
        }
        return total
    }, 0)

    let row = index > 0 ? currRow : 0
    let prevItem = { row, col: 0, rowspan, colspan: 1 }
    let nextItem = { row, col: 1, rowspan, colspan: 1 }

    arr.push(prevItem, nextItem)
    return arr
}, [])