Blaze like control statements (if/else etc) in jsx

I just came across jsx-control-statements and it forcibly reminded me of good ol’ Blaze :grin:

Here is very short intro https://medium.com/@tomat/a-cleaner-solution-for-conditionals-and-loops-in-jsx-using-babel-6-a67dcaee9b06#.3sapn8lp6

Thanks for the share but those UI frameworks are going around in circles so it seems. I thought in react you’ve the full power and purity of JS but apparently the community is rediscovering the value in template like syntax within jsx.

I was evaluating react and vue and leaning toward react at some point but frankly seeing things like makes vue a more attractive choice.

1 Like

Yes, my thoughts exactly!

Hum, seing this code

<div>
  {condition1 ?
    [
      (condition2 ?
        [
          <span></span>,
          'My name is ' + name + '!',
          <span></span>
        ]
      : null),
      'Hello ' + name + '!'
    ]
  : <span>Something else</span>}
  {myArray.map((item) => (
    <div>
      {item.awd}
    </div>
  )}
</div>

I don’t think JSX is the problem, and i don’t think nesting if and else is the right solution !

I don’t think using jsx-control-statements is really a common thing in the React community FWIW. So perhaps some part of the community is looking into it but it seems to be small.

1 Like