Created
December 5, 2017 16:39
-
-
Save rscott78/868d03ca38c7e083a6b043e50a07a05b to your computer and use it in GitHub Desktop.
This shows the use of a simple model in a react form. Input and state changes are handled by a single method.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
export default class RegistrationForm extends React.Component { | |
constructor(props) { | |
super(props); | |
this.state = { | |
model: { | |
firstName: '', | |
lastName: '' | |
} | |
}; | |
} | |
handleInputChange = (e) => { | |
let model = this.state.model; | |
model[e.target.name] = e.target.value; | |
this.setState({ | |
model: model | |
}); | |
} | |
render() { | |
return <div> | |
<input name="firstName" value={this.state.firstName} onChange={this.handleInputChange} /> | |
<input name="lastName" value={this.state.lastName} onChange={this.handleInputChange} /> | |
</div>; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment