Repository navigation
Theoretical: Drop JSXText #8
Description
Bear with me here :)
JSX currently looks like this:
<div>
{'Name of things:' + name} -- no one really does this
Number of things: {count}
<span>
Some {cond ? children : null}
{'Some newline\n'}
</span>
</div>
What if it looked like:
<div>
'Name of things: ' + name, -- it's now intuitive to concatenate
'Number of things: ', count
<span>
'Some ', (cond ? children : null),
'Some newline\n'
</span>
</div>
- "Arbitrary" JSX white-space rules can be chucked out the window, it's JS-strings plain and simple.
- It's super easy to add and see explicit leading/tailing white-space, no weird encoded values or lazy hacks.
- It's super easy/intuitive to concatenate stringy content instead of lazily creating more children.
- It's JS through-and-through + JSX-elements, comments behave as you would expect.
I imagine that it would be possible to omit ,, if you would really want to.
I realize this would be a ginormous departure from the heavily HTML-based syntax we have currently. From a purely theoretical/technical perspective it makes perfect sense in my opinion, but the practical aspects are obviously very questionable. I don't expect anyone to embrace this, but I think it's an interesting thought.
Activity
gajus commentedon Sep 3, 2015
The equivalent (ignoring whitespace and newline) using template strings:
syranide commentedon Sep 3, 2015
@gajus It's not equivalent though, you're including indentation and newlines.
gajus commentedon Sep 3, 2015
@syranide You are correct. 👍 Nevertheless, I wanted to include a template string example for visual reference only.
Does indentation and newline matter here?
syranide commentedon Sep 3, 2015
@gajus It ends up in the source code and also affects
white-space: pre. I would also expect many to prefer...over...
so those would also be affected by the leading and trailing whitespace.
gajus commentedon Sep 3, 2015
The only case it would matter is
white-space: pre. In that particular case you can just make an exception and use regular quotes.