TypeError when using &&

I wanted to remove a node depending on the value of model.isVisible.

TypeError: undefined is not an object (evaluating 'node.data')

---

Broken Code

export default ({isVisible}) =>
	{isVisible && <div>Example!</div>}

Workaround

export default ({isVisible}) =>
	{isVisible ? <div>Example!</div> : <div></div>}

---

Problem

In React the broken version should just work, I think it’s a cleaner solution (and actually it doesn’t create a DOM Node). I’m assuming this is a bug?

[jorgebucaran]

@dodekeract Correct, null is not handled! I’ll add it soon 👍.

[FlorianWendelborn]

@jbucaran Of course, the ternary operator is useful too. I use both all the time, depending on what exactly I want to achieve.

I still think the use-case for displaying a boolean is far more limited though. Especially since it isn’t even language-aware. It’ll display it in English all the time, which makes it useless for 75+% of the world. In addition to that I think returning false is probably the most explicit thing you can do to communicate “please don’t render this”.