Cannot read property 'length' of undefined using JSON object

167 views Asked by At

I am trying to fetch json api data from https://mocki.io/v1/d479a871-9165-45a1-a43d-cd2ae3e68845

its a complex json object with parent and child classes. I think sectionlist is the most fit component to display the data but any other most apropriate component if there is accepted since I am still new to react native. I have tried the following answer but seems far much to answer my question Cannot read property 'length' of undefined when using SectionList Here is my code`

import * as React from 'react';
 import { Button, View ,Pressable,Text,StyleSheet,ActivityIndicator,FlatList,SectionList} from 'react-native';
 import { createDrawerNavigator } from '@react-navigation/drawer';
 import { NavigationContainer } from '@react-navigation/native';
 import { createStackNavigator } from '@react-navigation/stack';
import { Component } from 'react/cjs/react.production.min';
 const Drawer = createDrawerNavigator();
 const Stack=createStackNavigator();
 export default class ScreenA extends Component {
 constructor(props) {
  super(props);

  this.state = {
    data: [],
    isLoading: true
  };
}

async getData() {
  try {
    const response = await fetch('https://mocki.io/v1/d479a871-9165-45a1-a43d-cd2ae3e68845');
    const json = await response.json();
    this.setState({ data: json });
  } catch (error) {
    console.log(error);
  } finally {
    this.setState({ isLoading: false });
  }
}

componentDidMount() {
  this.getData();
}

render() {
  const { data, isLoading } = this.state;

  return (
    <View style={{ flex: 1, padding: 24 }}>
      {isLoading ? <ActivityIndicator/> : (
       
        <View >
   <SectionList
      sections={this.state.data}
      renderItem={this.renderItem}
      keyExtractor={(item, index) => index}
      renderSectionHeader={({ section: { item.firstName } }) => (
         <Text >{item.loanAmount}</Text>
      )}
   />
</View>
      
      )}
    </View>
  );
}
};
`

any help will be Highly appreciated. Thanks in advance

0

There are 0 answers