未处理的拒绝（TypeError）：无法读取属性

Posted 2023-03-16

【中文标题】未处理的拒绝（TypeError）：无法读取属性

【英文标题】：Unhandled Rejection (TypeError): Cannot read property

【发布时间】：2021-05-17 04:55:34

【问题描述】：

我确定我的 api 已成功连接 popularGamesURL upcomingGamesURL 和 newGamesURL

当我尝试获取我的 api 时显示错误：

Unhandled Rejection (TypeError): Cannot read property 'popular' of undefined

我试过这种方法

gamesAction.js文件：

import axios from "axios";
import  popularGamesURL, upcomingGamesURL, newGamesURL  from "../api";

//Action creator

export const loadGames = () => async (dispatch) => 
  //Fetch axios
  const popularData = await axios.get(popularGamesURL());
  const newGamesData = await axios.get(newGamesURL());
  const upcomingData = await axios.get(upcomingGamesURL());

  dispatch(
    type: "FETCH_GAMES",
    paylaod: 
      popular: popularData.data.results,
      upcoming: upcomingData.data.results,
      newGames: newGamesData.data.results,
    ,
  );
;

gamesReducer.js文件：

const initialState = 
  popular: [],
  newGames: [],
  upcoming: [],
  searched: [],
;

const gamesReducer = (state = initialState, action) => 
  switch (action.type) 
    case "FETCH_GAMES":
      return 
        ...state,
        popular: action.payload.popular,
        upcoming: action.payload.upcoming,
        newGames: action.payload.newGames,
      ;
    default:
      return 
        ...state,
      ;
  
;

export default gamesReducer;

我试图找出错误。

请给点建议。

【参考方案1】：

您在 gamesAction.js 中使用错误的属性名称 paylaod（注意 ao 而不是 oa）调度一个操作，并且您正在期待在你的 reducer 中有一个名为 payload 的属性。

  dispatch(
    type: "FETCH_GAMES",
    paylaod:  // <=== this
      popular: popularData.data.results,
      upcoming: upcomingData.data.results,
      newGames: newGamesData.data.results,
    ,
  );

一个简单的错字，你应该有所有的方法在本地调试自己。

【讨论】：

谢谢！我试图找到大约 1 小时 ....typeError <:>