Вот проблемный компонент в вопросе.

const UserList = React.createClass({
  render: function(){
    let theList;
    if(this.props.data){
      theList=this.props.data.map(function(user, pos){
        return (
          <div className="row user">
            <div className="col-xs-1">{pos}</div>
            <div className="col-xs-5">{user.username}</div>
            <div className="col-xs-3">{user.recent}</div>
            <div className="col-xs-3">{user.alltime}</div>
          </div>
        );
      }, this);
    } else {
     theList = <div>I don't know anymore</div>;
    }
    console.log(theList);
    return (
      theList
    );
  }
});

Всякий раз, когда я пытаюсь вернуть {theList}, я получаюНе удается прочитать свойство '__reactInternalInstance $ mincana79xce0t6kk1s5g66r' со значением NULL ошибка. Однако если я заменю {theList} на статический html, console.log выведет правильный массив объектов, которые мне нужны. Что касается ответов, я попытался вернуть и {theList}, и theList, но это не помогло.

В обоих случаях console.log сначала печатает [], что, как я полагаю, связано с тем, что componentDidMount содержит мой ajax-вызов для получения json с сервера и еще не сработал до первого render (). Я попытался проверить, что this.props.data имеет значение null, но это не помогает.

Вот родительский компонент, если он помогает:

const Leaderboard = React.createClass({
  getInitialState: function(){
    return ({data: [], mode: 0});
  },
  componentDidMount: function(){
    $.ajax({
      url: 'https://someurlthatreturnsjson',
      dataType: 'json',
      cache: false,
      success: function(data) {
        this.setState({data: data});
      }.bind(this),
      error: function(xhr, status, err) {
        console.error('https://someurlthatreturnsjson', status, err.toString());
      }.bind(this)
    });
  },
  render: function(){
    return (
      <div className="leaderboard">
        <div className="row titleBar">
          <img src="http://someimage.jpg"></img>Leaderboard
        </div> 
        <HeaderBar />
        <UserList data={this.state.data}/>
      </div>
    );
  }
});