Context 通过组件树提供了一个传递数据的方法，从而避免了在每一个层级手动的传递 props 属性

Context 设计目的是为共享那些被认为对于一个组件树而言是“全局”的数据，例如当前认证的用户、主题或首选语言。例如，在下面的代码中，我们通过一个“theme”属性手动调整一个按钮组件的样式：

 

 使用 context, 我可以避免通过中间元素传递 props：

 

 

  • 不要仅仅为了避免在几个层级下的组件传递 props 而使用 context，它是被用于在多个层级的多个组件需要访问相同数据的情景。

  • 父组件 Provider 提供上下文 value

    下面代码中，父组件引入了实例，并且通过 MyContext.Provider 将父组件包装，并且通过 Provider.value 将方法提供出去。

  • 3、子组件 useContext 解析上下文

    下面是子组件，相同的，也需要从 context-manager 中引入 MyContext 这个实例，然后才能通过  const { setStep, setNumber, setCount, fetchData } = useContext(MyContext); 解析出上下文中的方法，在子组件中则可以直接使用这些方法，修改父组件的 state。