未捕获的类型错误:无法读取未定义的属性'map'( REACT NATIVE - Javascript )



一直在尝试导入Json文件,然后在React Native应用程序中浏览并显示它。我只是在学习React Native,同时学习Javascript。

import React, { Component } from 'react';
import {
Text,
View,
AsyncStorage
} from 'react-native';
import{eventos} from './Events';
export default class Admin extends React.Component{
constructor(props){
super(props);
this.state={
eventos
}
try{
AsyncStorage.getItem(eventos).then((value)=>{
if(value!=null){
console.log("Events esta completo")
}else{
console.log("Events esta vacio")
}
this.setState({
eventos:JSON.parse(value)
})
})
}catch(err){
console.log(err)
}
}
parseEventsData(){
console.log("Deberia salir algo")
return this.state.events.map((eventos,i)=>{
return(
<View key={i}>
<Text>
{eventos.title}
</Text>
<Text>
{eventos.responsible}
</Text>
<Text>
{eventos.description}
</Text>
</View>
)
})
}
render(){
return(
<View>
{this.parseEventsData()}
<Text>No salio nada</Text>                 
</View>
);
}

}

Json是下一个。

在此处输入图像描述

这就是我犯的错误。

在此处输入图像描述

我只是在学习React Native,同时学习Javascript。

在此处输入图像描述

检查您的代码,您可以注意到状态var被称为"eventos",并且您正在通过"this.state.events"进行映射。只是一个拼写错误。

您有几个问题:

  1. 您的parseEventsData中似乎有拼写错误。在其他任何地方你都称它为eventos,但在这里你却称之为events。不确定您想要哪一个,但不匹配意味着您对setState的调用设置的属性与稍后在parseEventsData中引用的属性不同
  2. 假设您修复了上面的拼写错误,this.state.eventos一开始将是未定义的,并且在构造函数中的promise解析之前不会被定义。当您调用this.state.eventos.map时,您正在对一个未定义的值调用map,正如您的错误所示。在调用map之前,您需要检查它是否未定义,或者应该将它初始化为一个空数组

最新更新