javascript数组对象排序问题

现在有arr1arr2两个数组,以arr1字段顺序为准,对arr2进行排序更新value值

let arr1 = [
    {
        title:"姓名",
        property:"name",
        width:120
    },
    {
        title:"年龄",
        property:"age", 
        width:120
    },
    {
        title:"角色",
        property:"role",
        width:120
    },
    {
        title:"修改前",
        property:"modify",
        width:120
        children:[
            {
                title:"体重",
                property:"weight",
                width:120
            },
            {
                title:"身高",
                property:"tall",
                width:120
            }
        ]
    }
]
let arr2 = [
   {
        title:"年龄",
        property:"age",
        width:100,
        date:()=>{},
        visible:false,
        id:2
    },
    {
        title:"修改前",
        property:"modify",
        width:100,
        children:[
            {
                title:"身高",
                property:"tall",
                width:100,
                visible:true,
                id:5
            },
            {
                title:"体重",
                property:"weight",
                width:100,
                visible:true,
                id:6
            }
        ]
    },
    {
        title:"姓名",
        property:"name",
        width:100,
        visible:false,
        id:3
    },
    {
        title:"角色",
        property:"role",
        width:100,
        visible:true,
        id:1
    }
]

想要如下效果

let arr3 = [
    {
        title:"姓名",
        property:"name",
        width:120,
        visible:false,
        id:3
    },
    {
        title:"年龄",
        property:"age",
        width:120,
        visible:false,
        id:2,
        renderWidth: 140,
        date:()=>{}
    },
    {
        title:"角色",
        property:"role",
        width:120,
        visible:true,
        id:1
    },
    {
        title:"修改前",
        property:"modify",
        width:120,
        children:[
            {
                title:"体重",
                property:"weight",
                width:120,
                visible:true,
                id:6
            },
            {
                title:"身高",
                property:"tall",
                width:120,
                visible:true,
                id:5
            }
        ]
    }
]
阅读 1.3k
1 个回答

这是我试验后的结果


const childOrderMap = new Map();

// 获取到顺序以及 children 的顺序
function getOrder (arr, key) {
  return arr.map(item => {
    if (item.children) {
      childOrderMap.set(item[key], getOrder(item.children, key));
    }
    return item[key];
  });
};

const order = getOrder(arr1, 'property');

function mapOrder(array, order, key) {
  return array.sort((a, b) => {
    const itemA = a[key];
    const itemB = b[key];
    // 对 children 进行排序
    if (a.children) {
      const childOrder = childOrderMap.get(itemA);
      a.children = mapOrder(a.children, childOrder, key);
    }
    if (b.children) {
      const childOrder = childOrderMap.get(itemB);
      b.children = mapOrder(b.children, childOrder, key);
    }
    return order.indexOf(itemA) - order.indexOf(itemB);
  })
}

const result = mapOrder(arr2, order, 'property');
console.log(result);
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题