Skip to content

Instantly share code, notes, and snippets.

@colbyr
Created March 9, 2016 23:02
Show Gist options
  • Save colbyr/4ef34f9a56f5de61fcb4 to your computer and use it in GitHub Desktop.
Save colbyr/4ef34f9a56f5de61fcb4 to your computer and use it in GitHub Desktop.
form state management with controlled components and partial application
import { partial } from '_';
import API from './API';
export default React.createClass({
getInitialState() {
return {
username: '',
password: '',
};
},
handleChange(fieldName, {target: {value}}) {
this.setState({[fieldName]: value});
},
handleSave(evt) {
evt.preventDefault();
API.login(this.state);
},
render() {
return (
<form onSubmit={this.handleSave}>
<input
onChange={partial(this.handleChange, 'username')}
placeholder="Username"
value={this.state.username}
/>
<input
onChange={partial(this.handleChange, 'password')}
placeholder="Password"
type="password"
value={this.state.password}
/>
<button type="submit">
Login
</button>
</form>
);
},
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment