const{createRoot}=ReactDOMconst{useState,useReducer,useEffect}=Reactconstroot=createRoot(document.getElementById('app'))functionApp(){//const[count,setCount]=useState(0)//搜集所有的操作某一个数据的方案//派发其传

useReducer 是React中的一个Hook，用于管理组件的状态。它提供了一种更复杂的状态管理机制，适用于那些状态逻辑较为复杂、包含多个子值的情况。与 useState 不同，useReducer 基于一个叫做reducer的函数来更新状态。Reducer接收当前的状态和一个表示要进行的操作的动作对象，

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

1.定义一个reducer函数（根据不同的action返回不同的新状态）2.在组件中调用useReducer，并传入reducer函数和状态的初始值3.事件发生时，通过dispatch函数分发一个action对象（通知reducer）要返回哪个新状态并渲染UIimport{useReducer}from"react"//1.定义一个reducer函数，根据不

1.准备importReact,{useReducer}from'react';//import{useIntl}from'react-intl';//用于国际化后续在写入暂时无效2.用于存放数据的函数constiniti

//返回一个可变的ref对象，该对象只有个current属性，初始值为传入的参数(id??'')。constactiveMenuKeyRef=useRef<string|number>(id??''); key[0]

state为空 数据展示

修改方案 

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

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

useReducer函数与redux中reducer函数如出一辙。在hooks函数中就是useState函数的替代方案。它接收一个形如(state,action)=>newState的reducer，并返回当前的state以

useReducervsuseState(面试)useReducer和useState都可以用来管理组件的状态，它们之间最大的区别就是：useReducer将状态和状态的变化统一管理在reducer函数里面，这样对