Render Props, Function as a Child, and Higher Order Components
Learn how you can combine render props and Function as a Child in combination with higher order components.
Here is a neat little trick. If you ever need a higher-order component but you only have a Function as a Child or render prop component, you can turn these into a higher order component like this:
function withCryptoPrices(WrappedComponent) {
return class extends React.Component {
render() {
return (
<CryptoPrices limit={5}>
{(cryptoPriceProps) => (
<WrappedComponent {...this.props} {...cryptoPriceProps} />
)}
</CryptoPrices>
);
}
};
}
Let’s implement this into an executable code.
Get hands-on with 1200+ tech skills courses.