reactjstypescriptreact-hoc

export default HOC(SampleComponent) doesnt' work with functional component React


I am unable to use the react feature of HOC with functional component. In below code export default HOC({component: SampleComponent}) doesnt work

const SampleComponent: FC = () => {
  return (<div>Hello World</div>);
};

export default HOC({ component: SampleComponent });

And the HOC is simply

const HOC = ({ component: Component }) => {
  return (<Component/>);
}

Solution

  • HOC should be

    const HOC = ({ component: Component }) => {
      return (props: {}) => (<Component/>);
    }