hooks学习笔记3-useContextuseContext 接收一个 context 对象（React.create

useContext

接收一个 context 对象（React.createContext 的返回值）并返回该 context 的当前值
当前的 context 值由上层组件中距离当前组件最近的 <MyContext.Provider> 的 value prop 决定
当组件上层最近的 <MyContext.Provider> 更新时，该 Hook 会触发重渲染，并使用最新传递给 MyContext provider 的 context value 值
useContext(MyContext) 相当于 class 组件中的 static contextType = MyContext 或者 <MyContext.Consumer>
useContext(MyContext) 只是让你能够读取 context 的值以及订阅 context 的变化。你仍然需要在上层组件树中使用 <MyContext.Provider> 来为下层组件提供 context

使用方法

import React,{createContext,useContext} from 'react';
const CounterContext = createContext({name:'wyt'});
const Demo = ()=>{
    return <Demo2></Demo2>
}
const Demo2 = ()=>{
    return <Demo3></Demo3>
}
const Demo3 = ()=>{
    const {name} = useContext(CounterContext)
    return <div>{name}</div>
}
export  default  function Father(){
    return (
        <CounterContext.Provider value={{name:'sld'}}>
            <Demo></Demo>
        </CounterContext.Provider>
    )
}