Sometimes, we want to add CSS display: none within conditional with React JSX.
In this article, we’ll look at how to add CSS display: none within conditional with React JSX.
How to add CSS display: none within conditional with React JSX?
To add CSS display: none within conditional with React JSX, we set the style prop.
For instance, we write
<div style={{ display: showStore ? "block" : "none" }}>
<div>a lot more divs</div>
</div>
to set the style prop to an object that has the display property set to 'block' if showStore is true and 'none' otherwise.
Conclusion
To add CSS display: none within conditional with React JSX, we set the style prop.
