gistfile1.js

/** @jsx React.DOM */
var MyRootComponent = React.createClass({
  getInitialState: function() {
    return {perMinute: '-', perDay: '-'};
  },
  componentDidMount: function() {
    var socket = io.connect(this.props.url);
    socket.on('business.clickout', this.setState.bind(this));
  },
  render: function() {
    return <MyComponent perMinute={this.state.perMinute} perDay={this.state.perDay} />;
  }
});

var MyComponent = React.createClass({
  render: function() {
    var perMinute = this.props.perMinute;
    var perDay = this.props.perDay;
    return (
      <div>
        <h3>Clickouts</h3>
        <p>last Minute: {perMinute}</p>
        <p>today: {perDay}</p>
      </div>
    );
  }
});
 
 
React.renderComponent(
  <MyRootComponent url="http://localhost:3000" />,
  document.getElementById('domid')
);

This is the sort of thing I am trying to do myself, I figured I should connect on my root component, but how would you pass the socket down to children components so that they may listen on specific channels?

This is the sort of thing I am trying to do myself, I figured I should connect on my root component, but how would you pass the socket down to children components so that they may listen on specific channels?