(精华2020年5月27日更新) react基础篇 react-hooks的useReducer的使用

import React , {useReducer} from 'react'
// (state,action)=>newState
const UseReducer = ()=>{
    const reducer = (state,action) =>{
        if(action.type === 'add'){
            return {
                ...state,
                count:state.count+1
            }
        }else{
            return state
        }
    }
    const addCount = ()=>{
        // dispatch
        dispatch(
            {
                type:'add'
            }
        )
    }
    // 第一项是当前的状态值 第二项是发送action的dispatch函数
    const [state,dispatch] = useReducer(reducer,{count:0})
    return (
        <div>
            <p>{state.count}</p>
            <button onClick={addCount}>增加</button>
        </div>
    )
}

export default UseReducer