核心思路：（适用于所有层级，不仅仅是爷孙 父子）

1. createContext方法创建一个上下文对象
2. 在顶层组件 通过Provider组件提供数据
3. 在底层组件，通过useContext钩子函数使用数据

import { createContext, useContext  } from "react"
const msgContext = createContext();
function A(){const AMsg = '我是A组件的消息'return (<div>A组件<B /></div>)
}
function B(){const bMsg = useContext(msgContext)return (<div>B组件-{bMsg}</div>)
}function App(){const msg = 'this is App组件'return (<div>App组件<msgContext.Provider value={msg}><A /></msgContext.Provider></div>)
}
export default App