Discussion on: The amazing Render props pattern for React.js — lifecycle begone!

[Coding Sam]

I use this pattern all the time but using different names.
Usually I create a Container component that implements the behaviour (and do more stuff like redux store connection) and pass properties to the Dumb component that just does rendering according to the props.

As an example:

function SomeContainer (props) {
  const onContinue = useCallback(() => {
    console.log('Just clicked');
  });

  return <SomeComponent onContinue={onContinue} />
}

function SomeComponent (props) {
  const { onContinue } = props;

  return (
    <div>
      <span>You can continue now</span>
      <button onClick={onContinue}>Continue</button>
    </div>
  );
}