从变量角度理解Hooks在React的世界里，Hooks的引入为函数式组件带来了前所未有的灵活性和能力。它们让我们得以完全摆脱class式的写法，在函数式组件中完成生命周期管理、状态管理、逻辑复用等几乎全部组件开发工作。这次，我们就从变量的角度来深入理解一下这些强大的Hooks。

useContext概念：useContext创建上下文，主要是解决组件跨级通信、传值示例：步骤1、使用creatContext方法创建一个context实例对象（通常在组件树的顶层）importReactfrom'react';constMyContext=React.createContext(defaultValue);备注：这里的defaultValue是当组件

欢迎回来，朋友们！?今天我们将回顾名为usecontext的reacthook的基础知识。usecontext是一个强大的工具，它比usestate更进一步，创建了一个类似全局的state，可以将信息传递给子组件和孙组件，而无需直接传递props。?但我有点超前了。?如果你不熟悉usestate，请先跳过去阅读我之前

目录useContext1、Provider和useContext2、Provider和Consumer3、Provider嵌套4、React.createContext提供的Provider和class的contextType属性5、读、写Context（1）父组件修改Context（2）子组件修改Context好书推荐useContext官方地址使用Context深度传递数据通

在React中，useContext是一个Hook，它允许你无需显式地通过组件树的每一层来传递props，就能将值深入到组件树的任何位置。要使用useContext，你需要先创建一个Context对象，然后使用这个对象提供的Provider组件来包裹你的应用中的一部分。然后，任何在这个Provider下的组件都

useContext和useReducer的联合用法（实现多组件多状态管理）useReduceruseReducer(reducer,initialArg,init?)参数reducer：(state:S,action:A)=>newState:S;用于更新state的纯函数。参数为state和action，返回值是更新后的state。state与action可以是任意合法值。initi

父组件中：importReact,{useState,createContext}from'react'import'./App.css';importChildOnefrom'./components/ChildOne';importChildTwofrom'./components/ChildTwo';exportconstCountContext=createContext(

1.useRef和useState类似，都是用来更新数据，但是useRef更新数据是同步的useRef返回一个对象，初始化数据保存在current字段下import{useRef}from'react';constdata=

  

   

一、什么是useContext在Reactclass式中父组件向子组件传递参数可以通过props，context。但是在函数式组件中需要向多层组件传递数据时，此时就可以使用useContext/二、

1.首先是user.jsximportReact,{createContext,useReducer}from'react'constUserContext=createContext()constuser={username:'',email:''

useReducer+useContext=全局状态管理类似于vuex，这样的意义是将所有组件的状态都挂载到外部，即组件内是无状态的。举个栗子useReducerimportReact,{useReduc

useContext应用场景：非父子组件通信，使用constGlobalContext=React.createContext()//创建供应商供应商提供数据//App组件提供数据<GlobalContextvalue={{t

 a、组件关系：依次嵌套Demo2->Demo2ComA->Demo2CompAA。。。b、实现可实现Demo2ComA与Demo2CompAA两组件间数据获取与修改（多层次嵌套时，也可实现，此处仅展示2

前置知识发布者订阅者模式可用于非父子组件传值。1.创建一个bus.js用来放订阅者和发布者的方法。letbus={arr:[],//订阅者（传入回调subScribe(callback)

useContext():共享状态钩子该钩子的作用是，在组件之间共享状态。关于Context这里不再赘述，其作用就是可以做状态的分发，在React16.X以后支持，避免了react逐层通过Props传递数

反应上下文ReactContextD耳朵伙计们：反应上下文API今天将讨论。React最好的特性之一是ReactContextAPI。如果你有兴趣，你应该继续阅读，因为这将是一个了不起的