Context

Context

用于组件、或说为子孙组件、多级组件之间的传递

–首先需要在全局创建一个 context,createContext(defaultValue?)

defaultValue,只会在内部组件 没有接收到 provide r 的 value 时 才会生效。

–从中解构出 context 需要的组件

  • 使用 provider 包裹 一个组件,其传递的 value 的值,可以传递到   该组件,乃至该组件的子孙组件中,实现数据的传递。

–子孙组件接收 context 需要 声明静态属性 contextType,为自己全局创建的 context

–调用使用


>>函数式组件   需要借助   Consumer 组件,才能获取到  context 传递来的数据,**或使用useContext.**

–其 value 就是   祖先组件 provider 的 value 属性中的数据。

useContext Hook

  • 外层还是通过 myContext.Provider 传递 context
  • 内层组件中通过 useContext(myContext)获取值
  • 只有 context 的数据变化,内层所有组件都会更新,如果要避免不必要的性能消耗,使用 react.memo()包裹组件缓存数据。


本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!