mangocaptain mangocaptain - 3 months ago 14
React JSX Question

How does JSX interpolate props for elements with checkbox inputs?

The below JSX works if

this.props.stocked
returns false or true but why doesn't it work if I just hardcode false in? As in replace it with
checked=false


<input
type="checkbox"
checked={this.props.stocked}
/>

QoP QoP
Answer

checked=false should be checked={false}

If you want to use a JavaScript expression as an attribute value, you have to wrap it in a pair of curly braces, otherwise you'll get a SyntaxError.

Embedded: JSX value should be either an expression or a quoted JSX text

You can read about it here

Comments