react中函数组件中使用useContext全局传值的方法

react中使用useContext步骤

        一共分为3步

1.在根组件中导入并且调用createContext方法

        代码示例

import { createContext } from 'react'
export const Context = createContext()

2.使用provider组件包裹根组件, 并且通过value属性提供要共享的数据

        代码示例

return(
    <Context.Provider value = {这里要放传递的数据}>
        <根组件的内容 />
    </Provider >
)

3.在任意后代的组件中,如果获取公共数据

        导入useCintext,调用useContext(第一步导出的contxt)得到value的值

        代码示例

import React,{ useContext } from 'react'
import {Context} from './index'
const 组件名称 = () => {
    const 公共数据 =useContext(Context)
    return (组件的内容)
}

直接调用公共数据就可以获得根组件中value传来的数据