setState不会在页面上设置具有动态段的对象

Question

我在使用动态段state的路径上的react-router加载的组件获取/item/:id时遇到问题：

var Item = React.createClass({
  mixins: [State],

  getInitialState: function () {
    return {data: {}};
  },

  loadTrackData: function () {
    api.getItemById(this.getParams().id, function (data) {
        this.setState({data: data});
    }.bind(this));
  },

  componentDidMount: function () {
    this.loadTrackData();
  },

  componentWillReceiveProps: function () {
    this.loadTrackData();
  },

  render: function () {
    console.log(this.state); // empty `data` object
    return (
        <div>
            <h2>{this.state.data.title.prop}</h2> // doesn't work
            // but works with 
            // <h2>{this.state.data.title}</h2>
        </div>
    );
  }
});

根本没有调用componentDidMount和componentWillReceiveProps中的任何一种方法！

渲染日志空data对象，因为它刚刚初始化..

路由器看起来像：

var routes = (
  <Route path="/" handler={Index}>
    <Route name="stream" path="/item/:id" handler={Item} />
    <DefaultRoute handler={Dashboard} />
  </Route>
);