provider:(和原生的一样)
import { createContext } from 'react'
import Usecontext from './04.useContext/useContext的使用'
export const UserContext = createContext()
export const ThemeContext = createContext()
export default function App () {
return (
<div>
<h2>App</h2>
<UserContext.Provider value={{ name: 'codev', age: 18 }}>
<ThemeContext.Provider value={{ name: 'zzz', study: 'react' }}>
<Usecontext />
</ThemeContext.Provider>
</UserContext.Provider>
</div>
)
}
接收者:
import React, {useState, useContext} from 'react'
import {UserContext,ThemeContext} from '../App'
export default function Usecontext() {
const user = useContext(UserContext)
const theme = useContext(ThemeContext)
console.log(user, theme);
return (
<div>
</div>
)
}