【问题标题】:How to push data into array as a JSON tree in react native?react-native - 如何将数据作为JSON树推送到数组中?
【发布时间】:2019-05-09 05:08:12
【问题描述】:

我正在使用 React Native 开发一个移动应用程序。我需要将一些数据放入具有类别(子键/子项)的数组中。我将数据存储在 Firebase 实时数据库中。因此,我想将这些数据推送到一个数组中,因为该 JSON 树存在。例如,我想构建一个如下所示的数组。有一个名为“水果”的类别。在此之下,它有“Apple”、“Strawberry”等。像这样,其他类别也是如此。

const items = [
    {
      name: 'Fruits',
      id: 0,
      children: [
        {
          name: 'Apple',
          id: 10,
        },
        {
          name: 'Strawberry',
          id: 17,
        },
        {
          name: 'Pineapple',
          id: 13,
        },
        {
          name: 'Banana',
          id: 14,
        },
        {
          name: 'Watermelon',
          id: 15,
        },
        {
          name: 'Kiwi fruit',
          id: 16,
        },
      ],
    },
    {
      name: 'Gems',
      id: 1,
      children: [
        {
          name: 'Quartz',
          id: 20,
        },
        {
          name: 'Zircon',
          id: 21,
        },
        {
          name: 'Sapphire',
          id: 22,
        },
        {
          name: 'Topaz',
          id: 23,
        },
      ],
    },
    {
      name: 'Plants',
      id: 2,
      children: [
        {
          name: "Mother In Law's Tongue",
          id: 30,
        },
        {
          name: 'Yucca',
          id: 31,
        },
        {
          name: 'Monsteria',
          id: 32,
        },
        {
          name: 'Palm',
          id: 33,
        },
      ],
    },
  ];

【问题讨论】:

  • 提供您想要的准确输入和输出
  • 输出就是上面的数组。输入是那些数据。首先,我有一个空数组。然后,我想将数据推送到数组中。不是一个普通的数组,而是一个有类别的数组。如上图所示。所以,我想知道如何推送这样的数据。谢谢。

标签: arrays json tree push


【解决方案1】:

让我们考虑输入具有我们期望的价值:

let output=[]
for(let i=0;i<input.length;i++){
  let obj={};
  obj.name = input[i].name
  obj.id = input[i].id
  obj.children = [ ...input.children]
  output.push(obj);
}

【讨论】:

  • 感谢您的回答。我可以知道我应该将另一个数组传递给这个 obj.children 吗?
  • 传递一个包含名称和id的对象的数组
  • 明白了。非常感谢您的帮助。 :-)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-03-31
  • 1970-01-01
  • 1970-01-01
  • 2018-12-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多