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>	
}