Hooks学习笔记之useReducer的使用方式:

基础使用

演示地址
完整代码:

import React, { useReducer } from 'react'

const Test = () => {

    const [count, dispatch] = useReducer((state, action) => {
        switch(action) {
            case 'add':
                return state + 1;
            case 'sub':
                return state - 1;
            default:
                return state;
        }
    }, 0)
    
    return (
        <div>
            <p>现在的分数是: { count }</p>
            <button onClick={() => {dispatch('add')}}>Increment</button>
            <button onClick={() => {dispatch('sub')}}>Decrement</button>
        </div>
    )
}

export default Test

在使用中useReducer一般至少带两个参数,第一个为方法、第二个为默认值