Redux 状态问题：类型错误：未定义不是对象

Question

我对原生和 Redux 的反应很陌生，特别是我收到了一条我真的很难处理的错误消息。这是我收到的错误TypeError：未定义不是对象（评估 '(0, _reactRedux.useSelector)(function (state) { return state.myPigeons.myPigeons; }).length'）我将在这里向您展示迄今为止我得到的所有相关代码，然后解释我这一切背后的意图。主屏.jsPigeon.js（动作）export const ADD_PIGEON = 'ADD_PIGEON';export const addPigeon = () => {    return {type: ADD_PIGEON}};Pigeon.js（减速器）import {ALLPIGEONS} from '../../data/pigeons_data';import { ADD_PIGEON } from '../actions/pigeon';const initialPigeonState = () => {    myPigeons = []};const pigeonReducer = (state = initialPigeonState, action) => {    switch(action.type){        case ADD_PIGEON:{            var generatedPigeon = Math.floor(Math.random() * ALLPIGEONS.length);            generatedPigeon.nickname = "Kuba";            var updatedPigeons = [...state.myPigeons, generatedPigeon]            return{...state, myPigeons: updatedPigeons}        }    };    return state;};export default pigeonReducer;鸽子数据.jsimport pigeon from '../models/pigeon';const ALLPIGEONS = [    new pigeon(        1,        "red",        "Red-billed pigeon",        " "    ),    new pigeon(        2,        "blue",        "Blue pigeon",        " "    ),    new pigeon(        3,        "white",        "Release dove",        " "    ),    new pigeon(        4,        "brown",        "Brown cuckoo-dove",        " "    ),    new pigeon(        5,        "green",        "Green pigeon",        " "    ),];export default ALLPIGEONS;应用程序.js//Automatic importsimport { StatusBar } from 'expo-status-bar';import React, {useState} from 'react';import { StyleSheet, Text, View } from 'react-native';import { Provider } from 'react-redux';//My importsimport * as Font from 'expo-font';import {AppLoading} from 'expo';import ReduxThunk from 'redux-thunk';import { createStore, combineReducers, applyMiddleware } from 'redux';这里的问题基本上是我想在 redux 中有一个状态，其中存储我所有的鸽子（我的状态现在应该是空的，因为我没有向我的状态添加任何鸽子）并且在我单击主屏幕中的按钮后。在 Node.js 中我向状态添加了一只鸽子，以便文本可以显示我有多少只鸽子。现在，当我进入主屏幕时，应用程序总是崩溃。我很感谢任何帮助！

Answer 1

main.js 中的 state.myPigeons 在启动应用程序时未定义。如果您尝试对 redux 对象执行某些操作，则应在其中定义该值。最好的方法是始终在代码中进行防御性检查，以检查对象是否“未定义”。

Answer 2

这段代码看起来不对

var generatedPigeon = Math.floor(Math.random() * ALLPIGEONS.length);

generatedPigeon.nickname = "Kuba";

尝试更多类似

var generatedPigeonNo = Math.floor(Math.random() * ALLPIGEONS.length);

var generatedPigeon= ALLPIGEONS[generatedPigeonNo];

generatedPigeon.nickname = "Kuba";

Answer 3

如果有人仍然试图找出给定代码中的问题，我想我明白了；

const initialPigeonState = () => {
    myPigeons = []
};

这就是整个问题。这里initialPigeonState定义为一个不返回任何东西的函数。从而导致错误。

现在为了消除错误，我们可以定义initialPigeonState为；

initialPigeonState = {
    myPigeons: []
}

或者，如果您想将其保留为函数，则从中返回一个对象；

const initialPigeonState = () => ({ 
   myPigeons: []
});

箭头符号后面的括号表示return返回其内部内容（此处为对象）。

Answer 4

您在哪里声明 MainScreen ？在 PB 导航器中？