反应多页，组件数据传递

我正在做一个反应应用程序和id，我想知道如何思考多页网站。实际上我正在做一个课程搜索器，我搜索器;我使用 routie 来渲染呈现呈现页面的不同组件。问题是它们不按层次结构关联，因此呈现结果的组件无法访问 ajax 数据。我已经徒劳地尝试使用 js var 数据，但没有 var 数据，但这也不起作用。我读了 https://facebook.github.io/react/tips/communicate-between-components.html但是我不知道如何处理自己的事件系统。如果有人可以说明本文档的最后一段，那么对于在这种情况下的所有人都很好。

var data = {}; 
var CourseSearcher = React.createClass({
    getInitialState: function(){
    return {
   return {  places: '',
      branch: 0,
      dayOfMonth: '',
      timeStart: '',
      timeEnd: '',
      data: []};
    },;
  },
  handlePlacesChange: function(e){
        this.setState({places: e.target.value});
    },
    handleBranchChange: function(e){
        this.setState({branch: e.target.value});
    },
    handleDayOfMonthChange: function(e){
        this.setState({dayOfMonth: e.target.value});
    },
    handleTimeStartChange: function(e){
        this.setState({timeStart: e.target.value});
    },
    handleTimeEndChange: function(e){
        this.setState({timeEnd: e.target.value}); 
    },
    handleSubmit: function(e){
        // stop the default browser action
        e.preventDefault();
        // Do an ajax post
        $.ajax({
            url:'php/results.php',
            dataType: 'json',
            type: 'GET',
      data: {
       data: {places: this.state.places,
        branch:this.state.branch,
        dayOfMonth:this.state.dayOfMonth,
        timeStart:this.state.timeStart,
        timeEnd:this.state.timeEnd},
      },
      success: function(data){
                this.setState({data: data});
        data = this.state.data; 
        routie('results');
            }.bind(this),
            error: function (xhr,status,err){
                console.error('php/results.php',status,err.toString());
            }.bind(this)
        });
    },
    render: function(){
      return(
        <div>
          <form method="get" onSubmit={this.handleSubmit}>
            <label>Où?</label>
            <input 
                type="text" 
                placeholder="Lieux" 
                value={this.state.places} 
                onChange={this.handlePlacesChange} 
            />
            <label>Quoi?</label>
            <select value={this.state.branch} onChange={this.handleBranchChange}>
              <option>Matière</option>
              <option>Français</option>
              <option>Anglais</option>
            </select>
            <label>Quand ?</label>
            <input 
            type="date" 
            value={this.state.dayOfMonth} 
            onChange={this.handleDayOfMonthChange} 
            /> 
            <input 
            type="time" 
            value={this.state.timeStart} 
            onChange={this.handleTimeStartChange}
            /> - 
            <input 
            type="time" 
            value={this.state.timeEnd} 
            onChange={this.handleTimeEndChange}/>
            <button type="submit">Go!</button>
          </form>
        </div>
        );
    }
}); 
console.log(data); 
var ResultList = React.createClass({
  render: function() {
      console.log(data);
      return(
      <h1>Hello</h1>);
    }
);
  }
});
var ResultBox = React.createClass({
  render: function() {
    return (
        <div>
          <h4>{}</h4>
        </div>
      );
      }
});
routie({
        '':function() {
          React.render(<CourseSearcher />,
              document.getElementById('content'));
        },
        'results': function() {
    React.render(
      React.render(<ResultList results={data} />,
            document.getElementById('content'));
        }
      });

使用反应路由器;)做得很好