Guest User

Untitled

a guest
Jan 18th, 2019
104
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.10 KB | None | 0 0
  1. class SignUpForm extends React.Component {
  2. constructor() {
  3. super();
  4. this.state = {
  5. name: '',
  6. email: '',
  7. password: '',
  8.  
  9. };
  10. }
  11.  
  12. handleNameChange = (evt) => {
  13. this.setState({name: evt.target.value});
  14. }
  15.  
  16. handleEmailChange = (evt) => {
  17. this.setState({email: evt.target.value});
  18. }
  19.  
  20. handlePasswordChange = (evt) => {
  21. this.setState({password: evt.target.value});
  22. }
  23. render(){
  24. return(
  25. <form onSubmit={this.handleSubmit}>
  26. <input
  27. type="text"
  28. placeholder="Enter Name"
  29. value={this.state.name}
  30. onChange={this.handleNameChange}
  31. />
  32. <input
  33. type="text"
  34. placeholder="Enter email"
  35. value={this.state.email}
  36. onChange={this.handleEmailChange}
  37. />
  38. <input
  39. type="password"
  40. placeholder="Enter password"
  41. value={this.state.password}
  42. onChange={this.handlePasswordChange}
  43. />
  44. <button disabled={isDisabled}>Sign up</button>
  45. </form>
  46. )
  47. }
  48.  
  49. }
  50.  
  51. handleChange = (type, event) => {
  52. this.setState({[type]: event.target.value});
  53. }
  54.  
  55. <input
  56. type="text"
  57. placeholder="Enter Name"
  58. value={this.state.name}
  59. onChange={(event) => this.handleChange('name', event)}
  60. />
  61.  
  62. handleChange = type => event => this.setState({[type]: event.target.value})
  63.  
  64. <input
  65. type="text"
  66. placeholder="Enter Name"
  67. value={this.state.name}
  68. id="name"
  69. onChange={this.handleChange('name')}
  70. />
  71.  
  72. handleChange = event => this.setState({[event.target.id]: event.target.value})
  73.  
  74. <input
  75. type="text"
  76. placeholder="Enter Name"
  77. value={this.state.name}
  78. id="name"
  79. onChange={this.handleChange}
  80. />
Add Comment
Please, Sign In to add comment