时间戳

首页 > 解决方案 > Redux Store：无法读取属性并且存储未定义

javascript - Redux Store：无法读取属性并且存储未定义

问题描述

我开始使用 redux 在一个 redux 项目中工作，这完全是一团糟，我设置了一个 Store 作为接口，如下所示：

interface Store {
  ads: {
    loading: boolean;
    data: Ad[];
    errors: Error;
    isPro: boolean; 
  };
}

interface Ad {
  id: any;
  title: any;
  body: any;
  price: any;
  latitude: any;
  longitude: any;
}

我将此常量称为要在之后调度的操作：

export const TYPE_ADD_JOB_ANNOUNCEMENT_REQUEST = "action/addJobAnnouncementRequest";

然后我有我的减速器：

   import {
  TYPE_ADD_JOB_ANNOUNCEMENT_REQUEST, 
} from "../constants/actions";

export const reducer = (Store: Store, action: any) => {
  switch (action.type) {

    case TYPE_ADD_JOB_ANNOUNCEMENT_REQUEST:
      console.log("Test");
      return {
        ...Store,
        annuncio: [...Store.ads.data, action.payload]
      };

    default:
      console.log("dont return nothing");
      break;
  }
  return Store;
};

我已经 ReduxDevTools 工作了，我用不同的控制台日志对其进行了测试，它工作正常，现在为什么当 reduxdevotools 尝试使用有效负载分派一个动作时，（例如：

{
  type: 'action/addJobAnnouncementRequest',
  payload: { title: "test" }
}

如果我尝试不同的测试但使用相同的模式，它会给我不同的错误，比如

商店未定义，

或者

无法读取属性“广告”

我认为我的 javascript 语法有问题，或者我不知道，谁能帮助我？

标签： javascriptreactjstypescriptredux

解决方案

您还应该初始化您的状态对象，因为它看起来就是您的错误ads来自的地方。如果您选择，您可以使用storeorStore代替。state

const initialState: Store = {
  ads: {
    loading: false,
    data: [],
    errors: '',
    isPro: false, 
  };
}

export const reducer = (state = initialState, action: any) => {
  switch (action.type) {
    case TYPE_ADD_JOB_ANNOUNCEMENT_REQUEST:
      return {
        ...state,
        ads: [...state.ads.data, action.payload] // I'm assuming you meant `ads` here?
      };

    default:
      return state;
  }
};

推荐阅读