使用PapaParse将带image[n].url表头的CSV解析为嵌套JSON的方法

完全可以实现，PapaParse默认输出扁平键值对结构，搭配路径解析后处理即可得到你需要的嵌套数组/对象结构，具体实现步骤如下：

• 配置PapaParse开启header: true参数，先完成基础解析，得到以原表头为键、单元格内容为值的扁平结构数据
• 编写通用路径处理逻辑，把image[0].url这类带数组下标的表头字符串拆解为路径段，自动创建对应的嵌套数组、对象结构，完成赋值

完整可运行代码示例 #

import Papa from 'papaparse';

/**
 * 解析带数组下标的路径字符串，转换为路径段数组
 * 例："image[0].tag[0]" → ["image", 0, "tag", 0]
 */
function parsePath(pathStr) {
  const segments = [];
  pathStr.split('.').forEach(segment => {
    const arrayMatch = segment.match(/^([a-zA-Z0-9_]+)\[(\d+)\]$/);
    if (arrayMatch) {
      segments.push(arrayMatch[1]);
      segments.push(Number(arrayMatch[2]));
    } else {
      segments.push(segment);
    }
  });
  return segments;
}

/**
 * 根据路径段向目标对象赋值，路径不存在时自动创建数组/对象
 */
function setNestedValue(target, pathSegments, value) {
  let current = target;
  for (let i = 0; i < pathSegments.length; i++) {
    const key = pathSegments[i];
    const isLastSegment = i === pathSegments.length - 1;
    const nextKey = pathSegments[i + 1];

    if (isLastSegment) {
      current[key] = value;
      return;
    }

    // 下一级路径为数字下标时，当前节点初始化为数组，否则初始化为对象
    if (current[key] === undefined) {
      current[key] = typeof nextKey === 'number' ? [] : {};
    }
    current = current[key];
  }
}

// 调用示例
const csvContent = `image[0].url,image[0].tag[0],image[1].url,image[2].url,image[3].url,image[4].url
https://invimg2.autofunds.net/InventoryImages/2021/11/24/3870_1699274_DC1_11288561_738124382021.jpg,Used 2011 BMW 3 Series 328i xDrive Sedan 4D,https://invimg2.autofunds.net/InventoryImages/2021/11/24/3870_1699274_DC2_83755912_738324382021.jpg,https://invimg2.autofunds.net/InventoryImages/2021/11/24/3870_1699274_DC3_47085920_738324382021.jpg,https://invimg2.autofunds.net/InventoryImages/2021/11/24/3870_1699274_DC4_16905684_738324382021.jpg,https://invimg2.autofunds.net/InventoryImages/2021/11/24/3870_1699274_DC5_10751374_738324382021.jpg
`;

Papa.parse(csvContent, {
  header: true,
  skipEmptyLines: true,
  complete: (parseResult) => {
    const nestedData = parseResult.data.map(flatRow => {
      const nestedRow = {};
      Object.entries(flatRow).forEach(([header, cellValue]) => {
        if (cellValue === '') return;
        const pathSegs = parsePath(header);
        setNestedValue(nestedRow, pathSegs, cellValue);
      });
      return nestedRow;
    });

    // 最终输出的nestedData结构和你给出的示例完全一致
    console.log(nestedData);
  }
});

扩展说明 #

• 上述代码默认支持对象[下标].属性[下标]格式的路径解析，和你给出的image[0].url、image[0].tag[0]场景完全匹配
• 如果需要支持更深层级的嵌套、或者特殊字段名，只要调整parsePath函数的正则匹配规则即可
• 空单元格会被自动跳过，不会生成无意义的空节点

内容的提问来源于stack exchange，提问作者Adhil Roshan