1
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",
  },
]

this is my json response and i want to fetch all my response object with array object and i have tried as:-

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

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

          )}
            </View>
    )}

using item then for inside i used sub with index
but then error showsthat undefined is not an object (evaluating 'item.resultlist.map')

how to fetch this nested arrays object or something is wrong with my response json please suggest me where i am wrng? and mostly when i try to fetch the single object inside the array's object with

let products = responseJson.response[0].resultlist[3];

then with console i can fetch only single object but when using this map function to fetch then its undefined

3 Answers 3

1

According to the problem, your JSON array has 4 objects but only 3 of them have nested array called resultlist & 1 object hasn't.

{
    "img": "https://www.act.com/image/catalog/cmsblock/Powerbank10.jpg",
    "product_id": 187,
    "sort_order": 1,
    "status": true,
    "type": "middleimage",
}

That's cause error undefined is not an object (evaluating 'item.resultlist.map') because you need an array in order to used map in JS. But that object hasn't resultlist.

That is something you need to handle from the backend. If not you can filtered that object or change structure of that object by adding resultlist:[] as below.

import * as React from "react";
import { Text, View, StyleSheet } from "react-native";

export default class App extends React.Component {
  state = {
    data: [
      {
        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"
      }
    ]
  };

  render() {
    let newArray = this.state.data.filter(obj => obj.resultlist);
    return (
      <View style={styles.container}>
        {newArray.map((item, i) => (
          <View>
            <Text key={i} style={{color: 'red'}}>{item.type}</Text>
            {item.resultlist.map((sub, index) => (
              <Text key={index}>{sub.name}</Text>
            ))}
          </View>
        ))}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#ecf0f1",
    padding: 8
  }
});

Hope this helps you. Feel free for doubts

Sign up to request clarification or add additional context in comments.

2 Comments

and if what we want to show some condition in this data like if we want to show as per sort order and if sort order changes then to show as per sort order ? is either we have to fix some content or we can use condition to fetch ?
I'm a bit confused about your question but if you want the sort to fetch data you can use sort() in JS.
1

The problem is your response array doesnt have the same object type throughout , like responseJson.response[1] doesnt have any key called resultlist.

So if you want to fetch and store all resultlist , there is a way like,

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>
    ))

Hope it helps. Feel ffree for doubts

3 Comments

render(){ const data = this.state.achhamall; let arrayOfData = []; {data.map((item, i) =>{ if('resultlist' in item){ item['resultlist'].map((eachObject) => { arrayOfData.push(eachObject); }) } } )}; return( <View> arrayOfData.map((data) => ( <Text>{data.name}</Text> )) </View> still getting the same error @gaurav_roy
arrayOfData you need to either make a global variable not inside render()
still getting the same error and making a console log then the data name is undefined
1

This is how you can iterate

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

state data

  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",
  },
]
  }

1 Comment

category_id is not an key

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.