React - TypeError:无法读取未定义的属性“dropdownList”
2020-11-27
610
我尝试从对象输出数据,但出现错误“TypeError: 无法读取未定义的属性‘dropdownList’”,在 Lesson 数组之前所有对象都成功到达,但随后出现未定义,这可能是什么问题?其他所有 jsx 都已删除以提高可读性 https://ibb.co/hRytjMB https://ibb.co/6F1YcBr
Lesson.jsx
{
this.props.lesson.dropdown.dropdownList.map(option =>
items.push(<option>{option.par}</option>)
)
}
lesson-reducer.js
import React from 'react';
import {faDotCircle} from "@fortawesome/free-solid-svg-icons/faDotCircle";
const ADD_LESSON = "ADD_LESSON";
const one = "Robby";
let initialState = {
lessonsTitle: [
{
iconName: faDotCircle,
description: [
<span className="yourClass">{one}</span>,
` advanced diverted domestic sex repeated bringing you old.`
],
dropdown: {
titleName: "JSON",
dropdownList: {
par: 'Hello World',
}
}
},
{
titleName: "Boolean",
iconName: faDotCircle,
description: `
Folly words widow one downs few age every seven. tolerably.
`,
languages: [
'Язык HTML2',
]
},
{
titleName: "Math",
iconName: faDotCircle,
description: `
Another journey chamber way yet females man.
`,
languages: [
'Язык HTML3',
]
},
],
};
2个回答
看来您的 Reducer 中存在不连贯的结构,从而导致未定义的错误。对于第一个对象,它应该可以工作,因为您确实有一个下拉对象,但其他两个对象没有,这可能会导致问题。
此外,您的 dropdownList 是一个对象,但如果您想对其进行迭代,它似乎应该是一个数组。
您可以尝试此验证以保持其清洁:
this.props.dropdown?.dropdownList?.map(...)
那里的询问点检查前面的值是否为 null 或未定义,如果不是,则提供对其属性的访问。否则,它会跳过前面的内容并转到下一个代码语句。
此外,您还应该迭代课程,因为它是一个数组
Vítor Brito
2020-11-27
您收到
TypeError: Cannot read property 'dropdownList' of undefined
的原因
是因为您尝试在没有索引的情况下访问
this.props.lesson
,并且它是一个数组/
由于
this.props.lesson
是一个数组,我认为您想使用
map()
而不是
this.props.lesson
来实现您的目标
Ron Gabbay
2020-11-27