Skip to content

Instantly share code, notes, and snippets.

@aaronpowell
Created March 26, 2015 00:33
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save aaronpowell/c5700b3d4f1612fc6df5 to your computer and use it in GitHub Desktop.
Save aaronpowell/c5700b3d4f1612fc6df5 to your computer and use it in GitHub Desktop.
var UserList = React.createClass({
render() {
return (
<table>
<thead>
<tr>
<th>Name</th>
<th></th>
</tr>
</thead>
<tbody>
{this.props.users.filter(user => user.enabled).map(user => <UserRow user={user} />)}
</tbody>
</table>
);
}
});
var UserRow = React.createClass({
contextTypes: {
userService: React.PropTypes.object
},
render() {
return (
<tr>
<td>{this.props.user.name}</td>
<td><button onClick={this.disable}>Disable</td>
</tr>
);
},
disable() {
this.context.userService.disable(this.props.userId);
}
});
var UserView = React.createClass({
childContextTypes: {
userStore: React.PropTypes.shape({
disable: React.PropTypes.func
})
},
getInitialState() {
return {
users: []
}
},
getChildContext() {
return {
userStore: {
disable: userId =>
xhr.post(`/api/user/${userId}/disable`)
.then(() => xhr.get(`/api/user`))
.then(users => this.setState({ users }));
}
};
},
render() {
return (
<UserList users={this.state.users} />
);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment