Pete V. Pete V. - 1 year ago 330
Javascript Question

indeterminate checkbox in React JSX

How do I render an indeterminate checkbox in JSX?

Here's what I've tried:

render() {
return <input type="checkbox"
checked={this.props.state === "checked"}
indeterminate={this.props.state === "indeterminate"} />

is not an attribute on the
, but a property. How do I set properties from React / JSX?

Answer Source

You can use the componentDidMount step (which is invoked after the initial rendering) to set that property:

componentDidMount() {
    React.findDOMNode(this).indeterminate = this.props.state === "indeterminate";

If you want that property to be updated with subsequent renders, do the same thing in componentDidUpdate also.