The document discusses the evolution of state management in React, from mixins to hooks. It covers older approaches like mixins, higher order components (HOCs), and render props. It then discusses the introduction of hooks in React 16.8, including the useState and useEffect hooks. It shows how hooks allow moving logic and state out of components into custom hooks. Finally, it discusses global state management and introducing context and custom hooks to share state across components without prop drilling.
9. Render Props
const App = () => (
<div>
<Mouse render={({ x, y }) => (
// The render prop gives us the state we need
// to render whatever we want here.
<h1>The mouse position is ({x}, {y})</h1>
)}/>
</div>
);
10. Render Props
const App = () => (
<div>
<Mouse render={({ x, y }) => (
// The render prop gives us the state we need
// to render whatever we want here.
<h1>The mouse position is ({x}, {y})</h1>
)}/>
</div>
);