useContext的使用

话不多说，用代码说话
useContext主要用于函数组件之间传值的问题

1.首先要进行导入createContext,useContext
import React,{useState,createContext,useContext} from 'react'
function Child(){
//在子组件中使用useContext进行接收父组件传递的上下文，这样值就能传递过来了
    const count1=useContext(CountContext)
    return (
        <h1>{count1}</h1>
    )
}
const CountContext=createContext()//首先创建一个上下文全局变量
function Example3(){
    const [count,setCount]=useState(0)

    function handleClick(){
        setCount(count+1)
    }
   
    return (
        <div>
            点击{count}
            <button onClick={handleClick}>clickme</button>
            其次是作为父组件将值传递过去，Provider 相当于提供者，Child是子组件
            <CountContext.Provider value={count}>
                <Child></Child>
            </CountContext.Provider>
        </div>
    )
}
export default Example3