vue3对象数组扁平化

Vue3中的对象数组扁平化通常是指将嵌套的对象数组转化为一层的键值对数组，以便于处理和展示。这在数据绑定、列表渲染等方面非常有用。你可以通过递归遍历对象数组，并将其属性作为新的数组元素，同时移除原对象。这里有一个简单的例子：

function flattenObjectArray(objArr) {
    return objArr.reduce((acc, obj) => {
        Object.entries(obj).forEach(([key, value]) => {
            if (Array.isArray(value)) {
                acc = [...acc, ...flattenObjectArray(value)]; // 如果值是数组，继续递归
            } else {
                acc.push({ [key]: value }); // 否则直接添加到结果数组
            }
        });
        return acc;
    }, []);
}

// 使用示例
const nestedData = [
  { key1: 'value1', key2: [{ subKey1: 'subValue1' }, { subKey2: 'subValue2' }] },
  { key3: 'value3', key4: 'value4' }
];

const flattenedData = flattenObjectArray(nestedData);
console.log(flattenedData);