false, null, undefined, true都是有效的children（子元素）梆暮。但是并不會(huì)被渲染出來，下面JSX表達(dá)式渲染效果是等效的：
<div />
// 下面表達(dá)式等同于最上面的表達(dá)式
<div></div>
<div>{false}</div>
<div>{null}</div>
<div>{undefined}</div>
<div>{true}</div>
一般條件渲染中會(huì)用到這個(gè)，比如 showHeader 為 true 時(shí)顺又， <Header /> 會(huì)被渲染：
<div>
{showHeader && <Header />}
<Content />
</div>
但是需要注意的是缎罢，為0 這種falsy值時(shí)，React仍然會(huì)被渲染饼问。 例如影兽，下面的做法可能和你期望的會(huì)不一致：
<div>
{props.messages.length && <MessageList messages={props.messages} />}
</div>
可以使用下面方式修復(fù)這個(gè)問題：
<div>
{props.messages.length > 0 && <MessageList messages={props.messages} />}
</div>
為了顯示上面的 null, true | false, undefined 等值， 可以使用 String 方法將其轉(zhuǎn)換為字符串類型
<div>
My JavaScript variable is {String(myVariable)}.
</div>
來源：
