function template() {
const renderItem = true;
return <div>
{renderItem &&
<div>This will render if renderItem is true</div>
}
</div>
}
You can render items and HTML in React based on condition. In the code snippet, we are rendering div id 'renderItem' variable is true. It will not render on the page if we set this variable false.
Multiple conditions
function template() {
const child = 10;
const message = "hello";
return <div>
{child > 5 && message === "hello" &&
<div>This will render if renderItem is true</div>
}
</div>
}
The above code will render the <div> element if child is greater than 5 and message is equals to hello.
0 Comments