TypeError: Cannot read property 'home_address' of undefined

I know line#24 runs before useEffect(). How to resolve this!! It is showing error that can not read property of undefined. You can also check data coming from API in POSTMAN.

1.  function App() {
2.  const[apiData,setApiData]=useState([]);
3.  const id=13
5.    useEffect(() => {
6.      async function loadData(url) {
7.        let response = await fetch(url, {
8.          method: 'POST',
9.          headers: { 'Content-Type': 'application/json' },
10.         // body: JSON.stringify({id:13})
11.       })
12.       let data = await response.json();
13.       console.log(data)
15.       setApiData(data);
17.     }
18.     loadData(`http://eign-backend.herokuapp.com/property/get-property/${id}/`);
19.   }
20.     , [])
21.   
22.   return (
23.     <div className="App">
24.     <h1>{apiData[0].home_address}</h1>
25.       </div>
27.   );
28. }
29. export default App;

84 thoughts on “TypeError: Cannot read property 'home_address' of undefined”