React没有加载Ajax调用的数据

Question

我已经构建了一个React组件，我希望在组件加载时将数据放入其中，但我不断将Array作为空。据我所知，如果我必须将数据放入组件中，我应该在ComponentDidMount方法中这样做。

以下是我的代码。

var Home = React.createClass({

    componentDidMount(){
    console.log('component mount');
    var self = this;
    var str = "junk string";
    $.ajax({
      url: "http://localhost:9000/checkoutcart/data/",
      type : "get",
      data : {
        ajaxid: 4, 
        UserID: str
        },
    }).then(function (data) {    
      self.setState({movieItem: data});
    });
},

getInitialState: function() {   
    console.log('getInitialState component mount');
    return {movieItem:[]};
  },

  render: function() {
      return (
        <div>          

        <div>               
        <div>
        <ol>
            {this.state.movieItem.map(stuff => (
              <li><h4>{stuff.title}</h4></li>
            ))}
          </ol>
        </div>
        </div>


        </div>
      );
    }
});