useReducer有点类似于Redux的管理,第一个参数是Reducer函数,第二个参数是默认值返回值和修改值的方法
import React, {useReducer} from 'react';
function Comp1(){
const [count,dispatch] = useReducer((state,action)=>{
switch (action.type) {
case 'add':
return state+1;
case 'sub':
return state-1;
default:
return state;
}
},0)
return (
<div>
<h2>当前的分数是{count}</h2>
<button onClick={()=>{ dispatch({type:'add'}) }}>增加</button>
<button onClick={()=>{ dispatch({type:'sub'}) }}>减少</button>
</div>
)
}
export default Comp1;