onchange props in react code example
Example 1: react how to pass the input target value
class NameForm extends React.Component {
constructor(props) {
super(props);
this.state = {value: ''};
this.handleChange = this.handleChange.bind(this);
}
handleChange(event) {
this.setState({value: event.target.value});
}
render() {
return (
<form>
<label>
Name:
<input type="text" value={this.state.value} onChange={this.handleChange} />
</label>
<input type="submit" value="Submit" />
</form>
);
}
}
Example 2: react set multible attribute values
render () {
const attributes = {
className: 'form-input form-input--email',
id: 'user-email',
type: 'email',
name: 'user-email',
placeholder: this.props.placeholder,
required: this.state.required
}
return <div className='form-field'>
<label className='form-label' htmlFor='user-email'>Email: </label>
<input {...attributes}>
</div>
}