diff --git a/content/docs/conditional-rendering.md b/content/docs/conditional-rendering.md index ec372541..8c85ee84 100644 --- a/content/docs/conditional-rendering.md +++ b/content/docs/conditional-rendering.md @@ -152,6 +152,19 @@ It works because in JavaScript, `true && expression` always evaluates to `expres Therefore, if the condition is `true`, the element right after `&&` will appear in the output. If it is `false`, React will ignore and skip it. +Note that returning a falsy expression will still cause the element after `&&` to be skipped but will return the falsy expression. In the example below, `
0
` will be returned by the render method. + +```javascript{2,5} +render() { + const count = 0; + return ( +
+ { count &&

Messages: {count}

} +
+ ); +} +``` + ### Inline If-Else with Conditional Operator {#inline-if-else-with-conditional-operator} Another method for conditionally rendering elements inline is to use the JavaScript conditional operator [`condition ? true : false`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Conditional_Operator).