Cannot render boolean value in JSX? Cannot render boolean value in JSX? reactjs reactjs

Cannot render boolean value in JSX?


Boolean Value: { ipsumText.toString() }

or

Boolean Value: { String(ipsumText) }

or

Boolean Value: { '' + ipsumText }

or

{`Boolean Value: ${ipsumText}`}

or

Boolean Value: { JSON.stringify(ipsumText) }

I prefer the second option. Universal, fast, works for all primitive types: Boolean( smth ), Number( smth ).


You can convert boolean value to string, concatenating it with empty string:

var ipsumText = true;ReactDOM.render(  <div>     Boolean Value: {ipsumText + ''}  </div>,  document.getElementById('impl'));

Or you can do it, when assigning bool value to variable:

var ipsumText = true + '';ReactDOM.render(  <div>     Boolean Value: {ipsumText}  </div>,  document.getElementById('impl'));

If your variable can have not boolean value, you should convert it to boolean:

// `ipsumText` variable is `true` now.var ipsumText = !!'text';


<select>    <option value={row.feature_product ? true: true || row.feature_product ? false: false}>    {`${row.feature_product}`}    </option>    <option value={row.feature_product ? false: true || row.feature_product ? true: false}>    {`${row.feature_product ? false: true}` || `${row.feature_product ? true: false}`}    </option></select>