Не могу найти переменную: отправка

Question

Я запускаю свое реактивное приложение, но получаю сообщение об ошибке, например: Не могу найти переменную: dispatch . Я использую редуктор для управления различными состояниями в этом приложении! Любая помощь будет оценена!

import React, {useReducer} from 'react';
import {Button, Text, View} from 'react-native';

const reducer = (state, action) => {

    switch (action.colorToChange) {
        case 'red':
            return {...state, red: state.red + action.amount};
        case 'green':
            return {...state, green: state.green + action.amount};
        case 'blue':
            return {...state, blue: state.blue + action.amount};
        default:
            return state;
    }
};

const HomeScreen = () => {
    const [state, action] = useReducer(reducer, {red: 0, green: 0, blue: 0});
    const {red, green, blue} = state;

    return (
        <View>
            <Button title="Red"  onPress=() => {dispatch({colorToChange: 'red', amount: 1})}/>
            <Button title="Green" onPress={() => dispatch({colorToChange: 'green', amount: 1})}/>
            <Button title="Blue"  onPress={() => dispatch({colorToChange: 'blue', amount: 1})}/>

            <Text>Red Color:{red}</Text>
            <Text>Green Color:{green}</Text>
            <Text>Blue Color:{blue}</Text>
        </View>
    );
};

export default HomeScreen;

Answer 1

useReducer возвращает диспетчеризацию как второй элемент деструктурированного массива, в вашем случае он называется action, вам следует изменить строку use use limit на

 const [state, dispatch] = useReducer(reducer, {red: 0, green: 0, blue: 0});

, после этого вы сможете использовать диспетчеризацию. Вы можете использовать его сейчас, вызывая action () .. но наименование кажется совершенно неправильным

Answer 2

Вторая переменная - это отправка от useReducer, поэтому она должна быть равна

const [state, dispatch] = useReducer(reducer, {red: 0, green: 0, blue: 0});