Skip to content

Instantly share code, notes, and snippets.

@brigand
Forked from sebmarkbage/Enhance.js
Last active May 10, 2020 01:56
Show Gist options
  • Save brigand/1c476f365a503d5a1e2d to your computer and use it in GitHub Desktop.
Save brigand/1c476f365a503d5a1e2d to your computer and use it in GitHub Desktop.
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
@gaearon
Copy link

gaearon commented Apr 21, 2015

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

@zemirco
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