React - Handling form with onChange attribute

0 votes
256 views
added Aug 9, 2019 in React by LC Marshal Captain (25,790 points)
class TestFormComponent extends React.Component {
  constructor(props) {
    super(props)
    this.state = { hobby: '' }
  }

  handleChange(event) {}

  render() {
    return (
      <form>
        Username:
        <input
          type="text"
          value={this.state.hobby}
          onChange={this.handleChange}
        />
      </form>
    )
  }
}

export default TestFormComponent;

 

1 Response

0 votes
responded Aug 9, 2019 by LC Marshal Captain (25,790 points)
import React from 'react';

class EmailComponent 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 (
      <div id="nlsignup">
            <input type="email" name="EMAIL" className="email" id="mce-EMAIL" placeholder="email address" onChange={this.handleChange} value={this.state.value} required />
      </div>
    );
  }
}
export default EmailComponent;

 

lazacode.org - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.
...