Redux извлекается только если в хранилище нет данных - PullRequest
0 голосов
/ 28 апреля 2020

У меня есть приложение «Реакция-редукция». Я пытаюсь получить данные только в том случае, если в избыточном хранилище нет данных. Проверка магазина в действии с кодом ниже logi c выдает мне эту ошибку.

ReferenceError: Невозможно получить доступ к 'initialState' до инициализации

Почему журнал действий c запускается до инициализации хранилища?

Мой подход правильный ? Есть ли лучший способ добиться этого?

Как я могу исправить эту ошибку?

У меня есть действия и редуктор в одном файле. Я пытался разделить файл, но все равно получаю ту же ошибку.

import { Dispatch } from "redux";
import { Product } from "../../domain/interface";
import store from "../../redux";

export const RETRIEVE_PRODUCT_BEGIN = "RETRIEVE_PRODUCT_BEGIN";
export const RETRIEVE_PRODUCT_SUCCESS = "RETRIEVE_PRODUCT_SUCCESS";
export const RETRIEVE_PRODUCT_FAILURE = "RETRIEVE_PRODUCT_FAILURE";

interface RetrieveProductBeginAction {
  type: typeof RETRIEVE_PRODUCT_BEGIN;
}

interface RetrieveProductSuccessAction {
  type: typeof RETRIEVE_PRODUCT_SUCCESS;
  name: string;
  entities: Product[];
}

interface RetrieveProductFailureAction {
  type: typeof RETRIEVE_PRODUCT_FAILURE;
  errorMessage: string;
}

type ActionTypes =
  | RetrieveProductSuccessAction
  | RetrieveProductBeginAction
  | RetrieveProductFailureAction;

export interface EntityState {
  products: Product[];
  apiStatus: string;
  errorMessage: string;
}

const initialState: EntityState = {
  products: [],
  apiStatus: "",
  errorMessage: ""
};

export function productReducer(
  state = initialState,
  action: ActionTypes
): EntityState {
  const newState = { ...state };

  switch (action.type) {
    case RETRIEVE_PRODUCT_BEGIN:
      newState.apiStatus = "BEGIN";
      return newState;
    case RETRIEVE_PRODUCT_SUCCESS:
      newState.products = action.entities;
      newState.errorMessage = "";
      return newState;
    case RETRIEVE_PRODUCT_FAILURE:
      newState.errorMessage = action.errorMessage;
      return newState;
    default:
      return state;
  }
}

export function retrieveProductBegin(): ActionTypes {
  return { type: RETRIEVE_PRODUCT_BEGIN };
}
export function retrieveProductSuccess(
  name: string,
  entities: Product[]
): ActionTypes {
  return { type: RETRIEVE_PRODUCT_SUCCESS, name, entities };
}

export function retrieveProductFailure(errorMessage: string): ActionTypes {
  return { type: RETRIEVE_PRODUCT_FAILURE, errorMessage };
}

export function loadProduct(name: string) {
  const URL = "http://localhost:8080/api/products";

  const products = store().getState().products;
  if (products) {
    return function(dispatch: Dispatch): Promise<void> {
      return new Promise(function(resolve, reject) {
        console.log("Product data exists for: " + name);
      });
    };
  }

  return async function(dispatch: Dispatch): Promise<void> {
    try {
      dispatch(retrieveProductBegin());
      const response = await fetch(URL, {
        method: "GET",
        headers: { "content-type": "application/json" }
      });

      if (response.ok) {
        const body = await response.json();
        dispatch(retrieveProductSuccess(name, body));
      } else {
        const error = await response.text();
        dispatch(retrieveProductFailure(error));
      }
    } catch {}
  };
}

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...