In React, we can condtionally render data There is several way to do this…
#1=> If-else statements
#2=> Ternary operators
#3=> Logical operators
#Benifts
=> Display data based on certain conditions
=> Enhances user experience
=> Reduce unnessary rendering
function App(){
let array_new = ['one', 'two', 'three']
if(array_new.length == 0){
return <h1>No Data</h1>
}
return <ul>
{array_new.map((item)=>(
<li>{item}</li>
))}
</ul>
}
export default Appfunction App(){
let array_new = ['one', 'two', 'three']
return <ul>
{ array_new.length == 0 ? <h3>No data</h3>: null }
{array_new.map((item)=>(
<li>{item}</li>
))}
</ul>
}
export default Appfunction App(){
let array_new = ['one', 'two', 'three']
return <ul>
{array_new.length === 0 && <h3>No value</h3>}
{array_new.map((item)=>(
<li>{item}</li>
))}
</ul>
}
export default App
