Использование типа действия приставки в компоненте React

Question

Допустим, у меня есть этот код ниже:

switch (action.type) {
    case "GET_LIST":
        // update state
        break;
    case "GET_LIST_SUCCESS":
        // update state
        break;
    case "GET_LIST_ERROR":
        // update state
        break;
    default:
        return state;
}

До этого я уже настроил некоторых создателей действий (с промежуточным промежуточным программным обеспечением для асинхронных запросов). Таким образом, поток будет либо GET_LIST > GET_LIST_SUCCESS ИЛИ GET_LIST > GET_LIST_ERROR.

Теперь в моем компоненте React я хочу сделать что-то в зависимости от того, какой тип действия был отправлен в конце (либо успех, либо ошибка).

Является ли хорошей практикой использование типа действия самостоятельно или я должен просто использовать состояние хранилища для своего состояния? В этом примере мой магазин будет иметь свойство error, которое я могу использовать, чтобы определить, есть ли ошибка или нет.

Так что это либо (используя тип действия):

if (actiontype === "GET_LIST_SUCCESS") {
  // do something
}

ИЛИ (используя состояние магазина)

if (this.props.list.length > 0) {
  // do something
}

Какая практика лучше и почему?

Answer 1

Насколько я понимаю, у нас есть приложение с компонентами и приложение с магазином. Мы используем другая библиотека реагирует на редукцию, чтобы связать приложение реакции и приложение редукса. React-redux помогает использовать состояние избыточного хранилища в реагирующем компоненте и помогает распределять действия по избыточному хранилищу из реагирующего компонента.

Для обработки библиотек асинхронных операций, таких как Redux-thunk, и в зависимости от результата асинхронной операции эти библиотеки отправляют действие.

Ответ на ваш вопрос : React не знает, какое действие было отправлено в хранилище Redux, поскольку оно обрабатывается промежуточным ПО thunk. Но, используя React-redux, React может узнать текущее состояние хранилища Redux после того, как действие было отправлено промежуточным программным обеспечением thunk. Так что я думаю, что вы должны пойти со вторым вариантом. Первый вариант может быть возможен, но для этого потребуется много взлома, чем просто использование первого.

Answer 2

Просто мое мнение, но одно преимущество использования Redux перед хранением данных в состоянии компонента состоит в том, что вы разделяете заботу о том, как обрабатывать обновление данных от уровня представления (React) до Redux; Реагирующий компонент должен знать только, изменились ли данные, а не как они изменились. Это разъединяет уровень данных и уровень представления во внешнем интерфейсе и полезно, когда вам нужно выполнить цепочку действий для обновления состояния (например, выборка из API).

Если вы хотите представить текущий тип действия Redux компоненту React, вам нужно зарегистрировать действие где-то в вашем приложении, так как я не думаю, что Redux выставляет текущее действие для просмотра слоя. Кроме того, это также раскрывает слишком много информации о том, как Redux обрабатывает поток данных.

Обычной практикой является сохранение состояния выборки в логическом и журнале ошибок, например isFetching и fetchListError, обновите эти значения в процессе извлечения и передайте эти значения для просмотра слоя для отображения.