/Javascript/React/Render a react component only after API response is received

Render a react component only after API response is received

let component = () => {

let [chartData , setChartData ] = useState();
// an async API call that loads data into chartData state after successful response

return(
	{chartData && <QuoteChart chartData={chartData} iex={iex} />
	)
}


/* initially, chartData state will be undefined, thus the code block inside the 
return will evaluate to undefined ie. it will not be rendered. 
once the API response is received and charData will be assigned some real data, the component will rerender. 
this time, the code block will not evaluate to undefined. ie. the code block will render
*/

// for a more detailed discussion, read the below article 
https://daveceddia.com/watch-out-for-undefined-state/

Source: stackoverflow.com

Similar codes

2 votes205 views1 answer
React native cover image in parent view
Javascript React
0 vote245 views1 answer
Cookies in react native
Javascript React
91 votes428 views7 answers
React-router-dom
Javascript React
0 vote211 views1 answer
React string to integer
Javascript React
0 vote156 views1 answer
React node github project
Javascript React
0 vote221 views1 answer
React native dynamic style
Javascript React
0 vote213 views1 answer
How to run bare react-native project
Javascript React
0 vote207 views1 answer
How to detect if ios is in dark mode react native
Javascript React
5 votes205 views2 answers
Update react version
Javascript React
0 vote202 views1 answer
Firebase timestamp to date react
Javascript React