gistfile1.js

var MyList = React.createClass({
  componentWillMount: function () {
    this.setState({
      itemsDataContract: dataService.get('/api/items', {take: 10}) // returns a object describing the state of the request, not the actual data
    });
  }
  
  render: function () {
    var contract = this.state.itemsDataContract;

    switch (contract.state) {
      case 'error':
        return <ErrorPanel data={dataService.result(contract.id)} />
      case 'complete':
        return <List data={dataService.result(contract.id)} /> // access to the resulting data 
      default:
        return <Loading data={dataService.progress(contract.id)} />
    }
    
  }

})

gistfile2.js

function DataService() {}

var _contracts = {}, _dataCache = {};

DataService.prototype.get = function (path, params) {
  
  var id = checksum(arguments);
  
  //xmlhttpreq or whatever
  request(stuff, function (err, data) {
    _dataCache[id] = data;
    _contracts[id].state = !!err ? 'error' : 'complete';
    
  });
  
  var contract = {
    id: id,
    state: 'pending'
  };
  
  // some sort of cache check here to see if we consider any existing data still valid
  
  return _contracts[id] = contract;
};

DataService.prototype.result = function (id) {
  return _dataCache[id];
}