CODEWITHSUNDEEP
reactjsinput
Detlef D Soost
Detlef D Soost

Reputation: 98

React `value` prop on `input` should not be null

I'm new to react and I got this input in my component:

<input
        type="text"
        placeholder="..."
        className="form-control"
        value={this.state.value}
        disabled={this.props.edit}
        readOnly={this.props.readOnly}
        onChange={(e) => this.state.value = e}
    />

Now if this.state.value is empty I get this warning: 

Warning: `value` prop on `input` should not be null. Consider using an empty string to clear the component or `undefined` for uncontrolled components.

But if I change my input to:

<input
        type="text"
        placeholder="..."
        className="form-control"
        value={this.state.value || ""}
        disabled={this.props.edit}
        readOnly={this.props.readOnly}
        onChange={(e) => this.state.value = e}
    />

I can't edit it anymore.

Upvotes: 0

Views: 8977

Answers (1)

Rohan Veer
Rohan Veer

Reputation: 1490

It should be like -

onChange={(e) => this.setState({value:e}) }

Upvotes: 2

Related Questions