Как я могу следить за изменениями от редуктора в реактивном компоненте? - PullRequest
2 голосов
/ 02 октября 2019

У меня приложение прореагировать, и я использую редукс в качестве магазина. Наряду с редуксом я использую редукс-стук. Например, у меня есть действие getUsers, которое выбирает всех пользователей и сохраняет их в редукторе пользователя. Кроме того, если есть какая-то ошибка при получении, я сохраняю эту ошибку. Мой вопрос заключается в том, как в реагирующем компоненте с именем UsersOverwiew наблюдать за изменениями, происходящими в редукторе, например, за ошибкой, и показывать эту ошибку пользователю? Я сделал это с помощью ловушки useEffect, но есть ли лучший способ?

Пользовательский редуктор

case GET_USERS_BEGIN:
        return {
            ...state,
            users: {
                loading: true,
                error: {},
                data: []
            }
        };
    case GET_USERS_SUCCESS:
        return {
            ...state,
            users: {
                loading: false,
                error: {},
                data: action.users
            }
        };
    case GET_USERS_FAILURE:
        return {
            ...state,
            users: {
                ...state.users,
                loading: false,
                error: action.error,
            }
        };

Компонент UserOverview

// fetching users

useEffect(() =>{

    getUsers();

}, []);

// watch for changes in user reducer

useEffect(() =>{

    if(users.error){
        // if error happend do something
    }

}, [users]);

Это лишь малая часть кода, яуже все подключено, компонент и редуктор, но я хотел максимально упростить его.

1 Ответ

2 голосов
/ 02 октября 2019

Вы делаете это правильно, если вы используете функциональные компоненты. Приведенный выше ответ, который предполагает, что componentWillMount () требует компонентов на основе классов.

Однако делать это с помощью useEffect вполне нормально.

...