Firebase TypeError:undefined不是对象（正在评估事件[0]。名称）

为什么我不能访问我已经在then块中设置的状态？事件[0]。名称是导致此错误的事件。如何将数据传递到时间轴组件以处理此异步事件

  const Finalized = (props) => {
  const [events, setEvents] = React.useState([]);


  React.useEffect(() => {
    firebase
      .database()
      .ref("events/adventure")
      .once("value")
      .then((snapshot) => {
        setEvents(snapshot.val());
        // Not sure why when i console.log(events[0].name) my terminal gets flooded with the output
      });
  });
  let data = [
    {
      time: "09:00",
      title: "Event 1",
      description: <Text>{events[0].name}</Text>,
    },
  ];
  return (
    <View style={styles.container}>
      <Timeline style={styles.list} data={data} />
    </View>
  );
};

const Finalized=（道具）=>{
const[events，setEvents]=React.useState（[]）；
React.useffect（（）=>{
火基
.数据库（）
.ref（“事件/冒险”）
.一次（“价值”）
。然后（（快照）=>{
setEvents（snapshot.val（））；
//不确定为什么当我使用console.log（事件[0].name）时，我的终端会被输出淹没
});
});
让数据=[
{
时间：“09:00”，
标题：“事件1”，
描述：{events[0].name}，
},
];
返回(
);
};

您正在以异步方式设置事件，但试图访问数据数组中的事件[0]。名称。 因此，在加载事件之前的初始渲染中，将出现此错误

您可以做的一个修复是有条件地设置描述 描述：{events[0]？.name}

或者仅当事件数组至少有一个元素时才渲染时间线

  return (
    <View style={styles.container}>
     { events.length===1&& <Timeline style={styles.list} data={data} /> }
    </View>
  );

返回(
{events.length==1&&}
);

---

最好对snapshot.val（）做一个控制台日志，以检查您从firebase获得的值。

谢谢，您的第二个建议有效，但我不太明白您第一个建议的{events[0]？.name}含义。您能给我解释一下吗？在数据数组中，如果您这样设置描述，它将发送一个空的描述，第二个是更好的选择：）当错误发生时，事件数组是否有项目？仅应用第二个建议，我在第一次启动应用程序时仍然会收到错误。结合trickoh oki的第一个和第二个建议，最好检查事件数组内容：）