HOC — Higher-order Component

just a memo of how to implement HOC ( used to replace mixins, giving additional functionaly to the component )

Wrapper.js

import React from 'react';
export function Wrap(Component) {
return class extends React.Component {
constructor(props) {
super(props);
}
componentDidMount() {
console.log('component mounted');
}
componentWillUnmount() {
console.log('component is unmounting');
}
render() {
return (
<Component {...this.props} />
);
}
};
}

Component.js

import React from 'react';
import {Wrap} from 'Wrapper';
class Component extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<h1>Hello world!</he>
)
}
}
export default Wrap(Component);

now the component will have the ability to log when it mounts and unmounts..