如何引用 JSON Javascript 中的兄弟元素？

Question

我有一个 json 图表对象，如下所示：

{
  "results": [
    {
      "dataSets": {
        "One": {
          "label": "testLabel",
          "labels": "test",
          "data": [
            "10",
            "58"
          ]
        }
      },

      "chart": [
        {
          "key": "test",
          "label": "chart-1",
          "chartType": "bar",
          "order": "1",
          "dataSets": [
            {
              "style": "line",
              "key": "One"
            },
          ]
        }
      ]
    }
  ]
}

我想获得 dataSets 值，例如 label、labels、data 的“one” chart 的 dataSets 通过提供“one”作为键。

是否可以在 javascript 或 vue 中执行？

Answer 1

是的，这是可能的。但是您需要制作一系列 Array.map() 才能实现此目的。

const results = [{
  dataSets: {
    One: {
      label: "testLabel",
      labels: "test",
      data: ["10", "58"]
    }
  },

  chart: [{
    key: "test",
    label: "chart-1",
    chartType: "bar",
    order: "1",
    dataSets: [{
      style: "line",
      key: "One"
    }]
  }]
}];

const modifiedResult = results.map(result => {
  const outerDataSets = result.dataSets;
  result.chart = result.chart.map(chart =>
    chart.dataSets.map(innerDataSet => ({
      ...innerDataSet,
      ...outerDataSets[innerDataSet.key]
    }))
  );
  return result;
});

console.log(modifiedResult);

此外，如果您正在使用 Vue，我认为最好将 result 的修改放在计算上，这样它将始终尝试将这些 dataSets 附加数据添加到图表的数据集中。

Here a sample demo for implementation in Vue.

如何引用 JSON Javascript 中的兄弟元素？

How to refer sibling element in JSON Javascript?

json

siblings

javascript-objects

vue.js