Simple example:
import React from "react"; import ReactDOM from "react-dom"; const MyContext = React.createContext(); const MyProvider = MyContext.Provider; const MyConsumer = MyContext.Consumer; const data = { name: "Colin", age: 26 }; class HomePage extends React.Component { render() { return ( <MyConsumer> {props => { return ( <div> {props.name} : {props.age} </div> ); }} </MyConsumer> ); } } function App() { return ( <MyProvider value={data}> <div>Context API application:</div> <hr /> <HomePage /> </MyProvider> ); } const rootElement = document.getElementById("root"); ReactDOM.render(<App />, rootElement);