Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
import { Component } from "react";
export var Enhance = ComposedComponent => class extends Component {
static displayName = "Enhanced"
constructor() {
super();
this.state = { data: null };
}
componentDidMount() {
this.setState({ data: 'Hello' });
}
render() {
return <ComposedComponent {...this.props} data={this.state.data} />;
}
};
import { Enhance } from "./Enhance";
class MyComponent {
render() {
if (!this.data) return <div>Waiting...</div>;
return <div>{this.data}</div>;
}
}
export default Enhance(MyComponent); // Enhanced component
@bstro

This comment has been minimized.

Copy link

bstro commented Apr 5, 2015

Is this possible through createClass as opposed to ES6 classes?

@gaearon

This comment has been minimized.

Copy link

gaearon commented Apr 21, 2015

Yes. It's just a pattern, not a feature.

@zemirco

This comment has been minimized.

Copy link

zemirco commented May 6, 2015

I cannot get HigherOrderComponent.js to work. Shouldn't it be this.props.data instead this.data inside MyComponent? Because that actually works.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.