<pre lang="Javascript">{list?.product?.options?.1080p?.price?.value}
<pre lang="Javascript">import React,{ useEffect, useState} from 'react'; function Footer() { // we fetch rest api first before data gets loaded // using loadAsync method to allow data be loaded and fetch it after. const[list, setList] = useState([]); const[error, setError] = useState([]); const[load, setLoaded] = useState([]); useEffect(() => { const loadAsyncStuff = async () => { try { const response = await fetch('https://fe-assignment.vaimo.net/'); const json = await response.json(); setList(json); } catch (error) { setError(error); } finally { setLoaded(true); } }; loadAsyncStuff(); },[]); const names = ['1080p'];
// returning our values as data from rest api // embedding some form-inline to allow spacing and new line. return ( <div className="footer"> <form className='form-inline'> {list?.product?.discount?.amount} <p>Discount ends in</p> {list?.product?.discount?.end_date} </form> <br/><br/> <form className='form-inline'> {list?.product?.options?.battery_accessories?.label} {list?.product?.options?.battery_accessories?.price?.value}
} ); } export default Footer
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)