# 详解Hook之useContext函数

# useContext函数

这个函数用来创建context对象，而context对象的用法跟类组件中的context对象是一样的，也是完成跨组件通信的。

涉及到的语法有：

let MyContext = React.createContext()
let value = useContext(MyContext)

let MyContext = React.createContext()用于得到一个可以进行传递数据的组件，<MyContext.Provider value={}>用于实现数据的传递。let value = useContext(MyContext)用于获取传递进组件内的值。

let { useContext } = React;
let MyContext = React.createContext('默认值');
let Welcome = (props) => {  
    return (
        <div>
            hello Welcome
            <MyContext.Provider value="welcome的问候~~~">
                <Head />
            </MyContext.Provider>
        </div>
    );
}
let Head = () => {
    return (
        <div>
            hello Head
            <Title />
        </div>
    );
}
let Title = () => {
    let value = useContext(MyContext);
    return (
        <div>
            hello Title, { value }
        </div>
    );
}

← 详解Hook之useRef函数函数组件性能优化之React.memo →