Can this be done with vanilla React? about jsx-control-statements

[texttechne]

Actually there are a couple of projects which realize the conditional part as React component. But they are all confronted with the following problem:

<If condition={obj}>
    <div>{obj.name}<div>
</If>

The code inside the <If> statement would get evaluated nonetheless, even if obj is false or undefined. Hence the compilation step, which is the only elegant way to solve this.

Read also Why Transform. This reason should probably be made more prominent, like putting it into the intro section. So let's keep this issue open until it is better documented.

[trusktr]

A compile-step advantage I see is being able to convert each="item" into a variable reference, not possible with runtime.

[texttechne]

Pros

• Conditionals are not flawed
• For statements with variable reference are made possible
• There's no penalty on the runtime performance
• It works exactly as JSX is supposed to work: Plain syntactic sugar

Cons

• Requires Babel (6)
• Penalty on build time performance

[texttechne]

Closing in favor of #39