Render Prop: Using Props Other Than render
Using Props Other Than render
<Mouse children={mouse => (
<p>The mouse position is {mouse.x}, {mouse.y}</p>
)}/>
//or
<Mouse>
{mouse => (
<p>The mouse position is {mouse.x}, {mouse.y}</p>
)}
</Mouse>
It’s important to remember that just because the pattern is called “render props” you don’t have to use a prop named render to use this pattern.
Any prop that is a function that a component uses to know what to render is technically a “render prop”.