如何在React Native中获取数组对象内部的嵌套数组对象

问题描述 投票:0回答:2
Array [
  Object {
    "resultlist": Array [
      Object {
        "img": "https://www.act.com/image/cache/catalog/new%20thumbnails/Mifa%20A1BlacjkThumbnail-600x600.jpg",
        "name": "Mifa F1",
        "product_id": 87,
        "type": "product",
      },
      Object {
        "category_id": 20,
        "img": "https://www.achhacart.com/image/catalog/cmsblock/hgb5.png",
        "name": "Earphone",
        "type": "category",
      },
      Object {
        "img": "https://www.achhacart.com/image/catalog/cmsblock/air.gif",
        "name": "Air Purifier",
        "product_id": 87,
        "type": "product",
      },
      Object {
        "img": "https://www.achhacart.com/image/catalog/cmsblock/Powerbank10.jpg",
        "name": "Powerbank",
        "product_id": 87,
        "type": "product",
      },
    ],
    "sort_order": 0,
    "status": true,
    "type": "product",
  },
  Object {
    "img": "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
    "product_id": 187,
    "sort_order": 1,
    "status": true,
    "type": "middleimage",
  },
  Object {
    "resultlist": Array [
      Object {
        "img": "https://www.act.com/image/cache/catalog/new%20thumbnails/Mifa%20A1BlacjkThumbnail-600x600.jpg",
        "name": "Mifa A1 Black",
        "product_id": 87,
        "type": "product",
      },
      Object {
        "category_id": 20,
        "img": "https://www.act.com/image/catalog/cmsblock/hgb5.png",
        "name": "Earphones",
        "type": "category",
      },
      Object {
        "img": "https://www.act.com/image/catalog/cmsblock/air.gif",
        "name": "Air Purifiers",
        "product_id": 87,
        "type": "product",
      },
      Object {
        "img": "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
        "name": "Powerbanks",
        "product_id": 87,
        "type": "product",
      },
    ],
    "sort_order": 2,
    "status": true,
    "type": "product",
  },
  Object {
    "resultlist": Array [
      Object {
        "image": "https://www.act.com/simage/catalog/1AA/WeChatImage_20191228151402.jpg",
        "link": "",
        "title": "slider1",
      },
      Object {
        "image": "https://www.act.com/staging-achhamall.com/image/catalog/1accc/WeChatImage_20191231125513.jpg",
        "link": "",
        "title": "slider2",
      },
    ],
    "sort_order": 3,
    "status": true,
    "type": "slider",
  },
]

这是我的json响应,我想获取所有带有数组对象的响应对象,而我已经尝试过:-

   {data.map((item, i) =>
        <View>
        <Text key={i}>{item.type}</Text>

        {
          item.resultlist.map((sub,index)=>
            <Text key={index}>sub.name</Text>

          )}
            </View>
    )}

然后使用项目,然后在内部使用带有索引的子项目但是然后错误表明undefined is not an object (evaluating 'item.resultlist.map')

如何获取此嵌套数组对象或我的响应json出了点问题,请提示我我在哪里?多数情况下,当我尝试使用

来获取数组对象内的单个对象时
let products = responseJson.response[0].resultlist[3];

然后使用控制台,我只能获取单个对象,但是当使用此map函数获取其未定义的对象时

arrays react-native
2个回答
0
投票

这是您可以迭代的方式

render() {
    const {array} = this.state;
    return (
      <View style={styles.container}>
       {array[0].resultlist.map(item=>
        <View key={item.category_id}>
        <Text>{item.name}</Text>
        </View>
       )}
      </View>
    );
  }

状态数据

  state={
    array:[{
    "resultlist": [
       {
        "img": "https://www.act.com/image/cache/catalog/new%20thumbnails/Mifa%20A1BlacjkThumbnail-600x600.jpg",
        "name": "Mifa F1",
        "product_id": 87,
        "type": "product",
      },
       {
        "category_id": 20,
        "img": "https://www.achhacart.com/image/catalog/cmsblock/hgb5.png",
        "name": "Earphone",
        "type": "category",
      },
       {
        "img": "https://www.achhacart.com/image/catalog/cmsblock/air.gif",
        "name": "Air Purifier",
        "product_id": 87,
        "type": "product",
      },
       {
        "img": "https://www.achhacart.com/image/catalog/cmsblock/Powerbank10.jpg",
        "name": "Powerbank",
        "product_id": 87,
        "type": "product",
      }
    ],
    "sort_order": 0,
    "status": true,
    "type": "product",
  },
   {
    "img": "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
    "product_id": 187,
    "sort_order": 1,
    "status": true,
    "type": "middleimage",
  },
   {
    "resultlist": [
       {
        "img": "https://www.act.com/image/cache/catalog/new%20thumbnails/Mifa%20A1BlacjkThumbnail-600x600.jpg",
        "name": "Mifa A1 Black",
        "product_id": 87,
        "type": "product",
      },
       {
        "category_id": 20,
        "img": "https://www.act.com/image/catalog/cmsblock/hgb5.png",
        "name": "Earphones",
        "type": "category",
      },
       {
        "img": "https://www.act.com/image/catalog/cmsblock/air.gif",
        "name": "Air Purifiers",
        "product_id": 87,
        "type": "product",
      },
       {
        "img": "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
        "name": "Powerbanks",
        "product_id": 87,
        "type": "product",
      },
    ],
    "sort_order": 2,
    "status": true,
    "type": "product",
  },
   {
    "resultlist": [
       {
        "image": "https://www.act.com/simage/catalog/1AA/WeChatImage_20191228151402.jpg",
        "link": "",
        "title": "slider1",
      },
       {
        "image": "https://www.act.com/staging-achhamall.com/image/catalog/1accc/WeChatImage_20191231125513.jpg",
        "link": "",
        "title": "slider2",
      },
    ],
    "sort_order": 3,
    "status": true,
    "type": "slider",
  },
]
  }

0
投票

问题是您的响应数组在整个过程中都没有相同的对象类型,例如responseJson.response [1]没有任何名为resultlist的键。

因此,如果您要获取并存储所有结果列表,可以使用类似的方法,

let arrayOfData = [];
  {data.map((item, i) =>{

    if('resultlist' in item){
      item['resultlist].map((eachObject) => {
        arrayOfData.push(eachObject);
      })
    }
  }

    )};

    Now do this after getting arrayOfData , plot as you want 

    arrayOfData.map((data) => (
      <Text>{data.name}</Text>
    ))

希望有帮助。感到疑惑]

© www.soinside.com 2019 - 2024. All rights reserved.