import React, { Component, createContext, useContext } from "react";
const AppContext = createContext();
class Head extends Component {
render() {
return (
<AppContext.Consumer>{(value) => <div>{value}</div>}</AppContext.Consumer>
);
}
}
class Content extends Component {
static contextType = AppContext;
render() {
const value = this.context;
return <div>{value}</div>;
}
}
const Foot = (params) => {
const value = useContext(AppContext);
return <div>{value}</div>;
};
class ContextUseDemo extends Component {
render() {
return (
<AppContext.Provider value="Hello word!">
<Head />
<Content />
<Foot />
</AppContext.Provider>
);
}
}
export default ContextUseDemo;