I have this in some React documentation, as well as screencasts. People will write { " " }
inside of their JSX templates.
Why do they do this? It looks like they are using it as an alternative to line breaks, but I don't see that explicitly explained anywhere.
JSX makes it easier to write or add HTML in React. JSX can easily convert HTML tags to react elements. It is faster than regular JavaScript. JSX allows us to put HTML elements in DOM without using appendChild() or createElement() method.
JSX is not a requirement for using React. Using React without JSX is especially convenient when you don't want to set up compilation in your build environment. Each JSX element is just syntactic sugar for calling React.
We use props in React to pass data from one component to another (from a parent component to a child component(s)). Props is just a shorter way of saying properties. They are useful when you want the flow of data in your app to be dynamic.
And since react is just a library for javascript, it makes no difference for you to choose between JSX or JS. They're completely interchangeable!
This is used to put an explicit space in a text block, since leading and trailing spaces are ignored at compile/transformation time when there is another tag.
Example:
<div> Text <a>some Text</a> </div>
Will result with Textsome Text
on the screen. (see the missing space)
<div> Text{' '} <a>some Text</a> </div>
Will result as wanted with Text some Text
on the screen.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With