Skip to content

Instantly share code, notes, and snippets.

Last active August 15, 2018 04:36
What would you like to do?
Idea for Dataloader component
// The `loader` prop is a Dataloader instance
class Dataloader extends React.Component {
state = {data: null, isLoaded: false};
componentWillMount() {
componentWillReceiveProps(nextProps) {
if ( !== || this.props.loader !== nextProps.loader) {
this.setState({isLoaded: false});
async prefetchData(props) {
const data = await props.loader.load(;
this.setState({data, isLoaded: true});
render() {
return this.props.render(, this.state.isLoaded);
// TODO: Support for loader.loadMany, loader.clear
function PostContainer {
return (
render={(post, isLoaded) => {
if (!isLoaded) {
return <Spinner />;
return <Post post={post} />;
Copy link

I've been programmed to think no setState in cWM and had no idea it was ok if async. Glad I checked this out. And nice idea.

(I also don't even think ReasonReact supports cWM, but could be wrong)

Copy link

dani-mp commented Sep 20, 2017

I'm also confused about it because of this Dan's SO answer and the React docs about cWM and cDM, so not sure what to do in a case like this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment