look-ma-no-redux.js

class ThingsFetcher extends React.Component {
 constructor (props) {
   super(props)
   this.state = {
      data: null,
      isLoading: false,
      wasLoadedSuccessfully: false,
      error: null
    }
 }
  
  componentDidMount () {
    this.getThings()
  }
 
  componentWillUnmount () {
    if (this.cancelAsync) {
     this.cancelAsync()
    }
  }
  
  getThings = () => {
    this.cancelAsync = doSomethingAsync()
      .then(this.handleSuccess)
      .catch(this.handleError)
  }
  
  handleSuccess = (data) => {
    this.setState({
      data,
      isLoading: false,
      wasLoadedSuccessfully: true,
      error: null
    })
  }

  handleError = (error) => {
    this.setState({
      data: null,
      isLoading: false,
      wasLoadedSuccessfully: false,
      error: error
    })
  }

  render () {
    return this.props.children(this.state)
  }
})

usage.jsx

<div>
  <ThingsFetcher>
    {(things) => <Things data={things.data} />}
  </ThingsFetcher>
</div>