如何将嵌套的 json 树转换为 csv答案

【问题标题】：How to convert a nested json tree into csv如何将嵌套的 json 树转换为 csv
【发布时间】：2019-07-03 21:34:04
【问题描述】：

现在我有一个嵌套的 JSON 树对象 (this.props.holdinginfo) 从后端发送到前端，我正在尝试在网页上添加一个导出按钮，以便能够将 JSON 对象导出到 csv使用 react 文件。

JSON 树对象如下：

[{'holder': 'Passive', 'Position': 500.0, 'pct_shares_out': 0.5,
    'Node': [{'holder': 'TD Inc.', 'Position': 300.0, 'pct_shares_out': 0.2,
            'Node': [{'holder': 'TD ETF', 'Position': 400, 'pct_shares_out': 0.1}, 
                 {'holder': 'TD Fund', 'Position': 430.0, 'pct_shares_out': 0.2}]}, 
 {'holder': 'Active', 'Position': 725.0, 'pct_shares_out': 0.1, 
    'Node': [{'holder': '18 Asset', 'Position': 390, 'pct_shares_out': 0.5, 
            'Node': [{'holder': '18 Inc.', 'Position': 190, 'pct_shares_out': 0.2}, 
                 {'holder': 'Lysander-18 Equity Fund Series A', 'Position': 19, 'pct_shares_out': 0.05}]}]}];

我希望 csv 文件遵循以下格式：

holder/position/pct_share_out
'Passive'/500.0/0.5
'TD Inc.'/300.0/0.2
'TD ETF'/400/0.1
'TD Fund'/430/0.2
'Active'/725/0.1
'18 Asset'/390/0.5
'18 Inc.'/190/0.2
'Lysander-18 Equity Fund Series A'/19/0.05

我现在正在做的是在组件的js文件中添加一个按钮：

<Button variant="contained" 
    size="small" 
    onClick={this.handleExport}>
    <SaveIcon label="Export" />
        Export
</Button>

调用handleExport将表格导出为csv文件：

handleExport = () => {
    let csv = Papa.unparse(this.props.holdinginfo);
    console.log(csv);
}

但是由于this.props.holdinginfo是嵌套树对象，所以console.log的输出是""[object Object],[object Object],[object Object],[object Object],[object Object], [对象对象],[对象对象]...."

我的问题 - 1- 如何将嵌套树 JSON 转换为 csv？ 2-当用户点击按钮时如何下载该csv？

感谢您的帮助！！

【问题讨论】：

嘿，因为我是新来的反应，你有任何示例代码我可以看看吗？
真的跟react没什么关系，纯JavaScript而已。我会尽快建立一个例子
参见 [stackoverflow.com/questions/8847766/…]。我认为它会对你有所帮助，除非你坚持使用 React。
你没有规定你正在使用的 javascript 框架......你会问什么库将 json 转换为 csv......或者你自己创建库并添加到你的简历中

标签： javascript json reactjs react-redux

【解决方案1】：

要进入一个简单的列表，可以使用类似于以下的递归函数：

const input = [{
  'holder': 'Passive',
  'Position': 500.0,
  'pct_shares_out': 0.5,
  'Node': [{
      'holder': 'TD Inc.',
      'Position': 300.0,
      'pct_shares_out': 0.2,
      'Node': [{
          'holder': 'TD ETF',
          'Position': 400,
          'pct_shares_out': 0.1
        },
        {
          'holder': 'TD Fund',
          'Position': 430.0,
          'pct_shares_out': 0.2
        }
      ]
    },
    {
      'holder': 'Active',
      'Position': 725.0,
      'pct_shares_out': 0.1,
      'Node': [{
        'holder': '18 Asset',
        'Position': 390,
        'pct_shares_out': 0.5,
        'Node': [{
            'holder': '18 Inc.',
            'Position': 190,
            'pct_shares_out': 0.2
          },
          {
            'holder': 'Lysander-18 Equity Fund Series A',
            'Position': 19,
            'pct_shares_out': 0.05
          }
        ]
      }]
    }
  ]
}];


var result = [];

function toCSV(items) {
  if (items) {
    items.forEach(function(a) {
      result.push({
        0: a.holder,
        1: a.Position + '/' + a.pct_shares_out
      });
      toCSV(a.Node);
    });
  }
}
  toCSV(input);
console.log(result)

可以根据需要进行修改，并在papaparse中使用。

【讨论】：

【解决方案2】：

我首先将 json 对象转换为列表，我将创建一个解析元素的递归函数，每次它找到一个属性时它只是附加它的值，但如果它找到一个对象或数组调用递归函数应该返回要附加到主列表的元素列表，或者不返回列表，您可以返回字符串，在递归期间构建字符串。我会考虑的另一个选择是创建一个递归函数将多级 json 对象转换为普通 json 对象，通过递归传递 json 对象，在每个递归中添加当前级别的属性，然后将其转换为我需要的任何内容. 当然，只有在我没有找到自动执行此操作的库或函数时，我才会尝试这些。

【讨论】：

【解决方案3】：

您不能调用 papa.unparse，因为您没有平面数组。您的数据结构是递归的，因此在将其发送到 papa.unparse 之前，您需要一个递归函数来展平 if。

const j = [{'holder': 'Passive', 'Position': 500.0, 
'pct_shares_out': 0.5,                          
'Node': [{'holder': 'TD Inc.', 'Position': 300.0, 'pct_shares_out': 0.2,                                
'Node': [{'holder': 'TD ETF', 'Position': 400, 'pct_shares_out': 0.1},                               
{'holder': 'TD Fund', 'Position': 430.0, 'pct_shares_out': 0.2}]},
{'holder': 'Active', 'Position': 725.0, 'pct_shares_out': 0.1,                                     
'Node': [{'holder': '18 Asset', 'Position': 390, 'pct_shares_out': 0.5,                                 
'Node': [{'holder': '18 Inc.', 'Position': 190, 'pct_shares_out': 0.2},                              
{'holder': 'Lysander-18 Equity Fund Series A', 'Position': 19, 'pct_shares_out': 0.05}]}]}]}];

const papa = require('papaparse');                                                               
function flatten(array) {                           
        var result = [];                                
        array.forEach(function (a) {                        
        var node = a.Node;
        delete a.Node;
        result.push(a);
        if (node) {
            result = result.concat(flatten(node));
        }
    });
    return result;
}
const flat = flatten(j);
console.log(flat)
console.log(papa.unparse(flat));

【讨论】：

【解决方案4】：

从后端获取json文件..
导入这个 module 将你的 json 传递给它
那么关于用户是否能够下载您的 csv.... 检查here

【讨论】：