Since when does Reason have JSX?
Since Reason was written by Jordan Walke and Cheng Lou (creators of React and React Motion, respectively), that's unsurprising.
What should go into JSX 2.0?
31–40 of 102 posts
Re: What should go into JSX 2.0?
#32I wish it could be possible to write this: const animal = "cat"; equivalent to:
That is one of the suggestions
Re: What should go into JSX 2.0?
#33Earlier quoted context omitted.
I think ternary expression are rather ok here, though not perfect: {cond1 && cond2 ? foo : null }
And you can inline if-statements with an IIFE when you need a little more space: {(() => { if (cond1 && cond2) return foo else ... })()} Though it makes GitHub think it's a Clojure file.
{(() => {
})()}
Re: What should go into JSX 2.0?
#34I like how the if proposal is down voted, probably because it's mentioning Angular. Conditional rendering in React is not always very clean. Most codebases end up resorting with something similar to this in a container to show a spinner while data is loading and rendering it when done. Problem is that the inner component will still be parsed and fail with cannot read property person of undefined. Yes, you can do this…
It's the extreme fanboyism there! Wrapping every component that has ` if` attribute with an `if` statement should not result into that: foo // results to if (cond1 && cond2) { return React.createElement('div', null, React.createElement('div', null, 'foo') ); } I'm not sure why this is bad? Because it's looking like Angular?!!
translates to
React.createElement('div', {if: })
This is bad because createElement always gets execute, whether the if expression evaluated to true or false. Changing this semantic would be messy.
Re: What should go into JSX 2.0?
#35Earlier quoted context omitted.
How about { data && } ?
If you render a more complex component this introduces another level of indentation. I can see why some people would prefer cleaner code but in my opinion, indenting ifs is a good thing as it increases the readability and allows you to spot if statements faster.
this is why you should be using immutable js. It will not throw errors accessing an object.
Re: What should go into JSX 2.0?
#36I like how the if proposal is down voted, probably because it's mentioning Angular. Conditional rendering in React is not always very clean. Most codebases end up resorting with something similar to this in a container to show a spinner while data is loading and rendering it when done. Problem is that the inner component will still be parsed and fail with cannot read property person of undefined. Yes, you can do this…
How about { data && } ?
[deleted]
Re: What should go into JSX 2.0?
#37Earlier quoted context omitted.
I think ternary expression are rather ok here, though not perfect: {cond1 && cond2 ? foo : null }
And you can inline if-statements with an IIFE when you need a little more space: {(() => { if (cond1 && cond2) return foo else ... })()} Though it makes GitHub think it's a Clojure file.
[deleted]
Re: What should go into JSX 2.0?
#38Some kind of way to parse variables only if they exist. The equivalent of (in Coffeescript)
a = {b:'c'}
a?.c //undefined
a.b //'c'
b?.c //undefined
Re: What should go into JSX 2.0?
#39Earlier quoted context omitted.
I think ternary expression are rather ok here, though not perfect: {cond1 && cond2 ? foo : null }
And you can inline if-statements with an IIFE when you need a little more space: {(() => { if (cond1 && cond2) return foo else ... })()} Though it makes GitHub think it's a Clojure file.
It’s interesting to see that there are so many ways of doing conditions in JSX. I myself wrote a tiny library (http://github.com/yuanchuan/cond) for it several months ago and thought it made the code looks clean but suffers the same undefined issue though.
Re: What should go into JSX 2.0?
#40I like how the if proposal is down voted, probably because it's mentioning Angular. Conditional rendering in React is not always very clean. Most codebases end up resorting with something similar to this in a container to show a spinner while data is loading and rendering it when done. Problem is that the inner component will still be parsed and fail with cannot read property person of undefined. Yes, you can do this…
The Flex method of conditional rendering is nice, far better than ng-if all over the place.