Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Flux over the Wire client.jsx
const client = new FluxClient('http://localhost:8080');
const messageList = client.Store('/messageList');
const postMessage = client.Action('/postMessage');
const MessageList = React.createClass({
getInitialState() {
return { messageList: this.props.messageList.head, message: null };
},
componentDidMount() {
messageList.onUpdate(({ head }) => this.setState({ messageList: head }));
},
submitMessage() {
this.props.postMessage.dispatch({ message: this.state.message });
},
render() {
return <div>
<ul>Messages
{messageList.map(({ message }, key) =>
<li ...{key}><Message ...{ message } /></li>
)}
</ul>
<input value={this.state.message}
onChange={({ target }) => this.setState({ message: target.value })} />
<button onClick={this.submitMessage} />
</div>;
}
});
React.render(<MessageList ...{ messageList, postMessage } >);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment