开发者问题收集

尽管我检查了数据是否存在,但 React 中的错误消息显示“无法读取未定义的属性”

2021-12-20
49

我一个月前才开始学习 React 。如果我提前问了一个非常简单的问题,我很抱歉。

这里有一个问题,

  • 有什么问题? :我从后端获取了名为“setWeekendEventData”的数据。当我控制台 WeekendEventData 时,我可以检查我是否收到了我想要的数据。 WeekendEventData

在这里,我只想要 DayName。在这种情况下,有两个 DayName 。因此,我尝试使用“map”方法,因为有时 DayName 可能是一个或两个或三个以上。 首先,我尝试这样做

{weekendEventData.map((obj, index) => {
                return <RedText>{obj[index].DayName}</RedText>;
              })}

但是,我收到此错误消息“无法读取未定义的属性(读取‘DayName’)”

  • 我尝试做的
{weekendEventData && weekendEventData.map((obj, index) => {
                return <RedText>{obj[index].DayName}</RedText>;
              })}

{[] && weekendEventData.map((obj, index) => {
                return <RedText>{obj[index].DayName}</RedText>;
              })}

我添加了 && 条件以使其始终为真,但出现相同的错误消息。通常,我使用 && 解决此类错误消息条件,但这次没有起作用。

  1. 使用“条件?:”但也没有起作用
  • 我的预期:它应该返回 DayName,即“개천절”和“한글날”

非常感谢您的评论或解决方案!

编辑 1:

const holiday = data => {
    let array = [];
    for (let i = 0; i <= 6; i++) {
      if (data) {
        if (array.includes(data[i])) i++;
        else array.push(data[i]);
      }
      console.log("데이터 값", data[i]);
      console.log("휴무일 배열", array);
    }

以及功能组件

<RedText>{holiday(weekendData)}</RedText>
1个回答

您在此处错误地使用了 index

obj[index].DayName

应按如下方式安全更正

obj.DayName || ""

删除重复项后以下内容有效

<RedText>
    {weekendEventData &&
        weekendEventData
            .reduce((prevValue, currValue) => {
                prevValue.indexOf(currValue.DayName) < 0 &&
                    prevValue.push(currValue.DayName);
                return prevValue;
            }, [])
            .join(", ")}
</RedText>
Amila Senadheera
2021-12-20