Ошибка типа: неопределенный не является объектом (оценка «this.state.project.horarios.map»)

#node.js #arrays #react-native

Вопрос:

Я пытаюсь отобразить массив в react native с помощью функции array.map, но она возвращает, что undefined не является объектом, когда я не передаю .map, он возвращает массив в console.log, но, конечно, я не могу его отобразить, посмотрите

 "horarios": Array [  Object {  "quarta": " 8:00-12:30/ 14:00-17:00",  "quinta": " 8:00-12:30/ 14:00-17:00",  "segunda": " 8:00-12:30/ 14:00-17:00",  "sexta": " 8:00-12:30/ 14:00-17:00",  "terca": " 8:00-12:30/ 14:00-17:00",  },  ],  

это массив, но когда я даю этот код:

 const tableData = this.state.project.horarios.map(horario =gt; console.log(horario.segunda) )  console.log(tableData)  

чтобы проверить, работает ли он, он возвращает мне следующее:

 TypeError: undefined is not an object (evaluating 'this.state.project.horarios.map')  

вот мой полный код:

 import React, { Component } from 'react'; import { StyleSheet, View, Text } from 'react-native'; import api from '../services/api'; import AsyncStorage from '@react-native-community/async-storage' import { ScrollView } from 'react-native-gesture-handler'; import { Ionicons } from '@expo/vector-icons'; import StarRating from 'react-native-star-rating'  const styles = StyleSheet.create({...});   export default class Profile extends Component{  state = {  errorMessage: null,  project:[],  user:{  id: this.props.route.params.name   }  }    getUser = async() =gt; {  try{  console.log('1')  const usu = JSON.parse(await AsyncStorage.getItem('@backend:user'))   console.log(usu._id)  console.log('2')  userID = this.state.user.id  console.log('3')  console.log(userID)  const response = await api.get(`/auth/`   userID)  console.log('4')  console.log(response.data)    const { project } = response.data  console.log('5')  this.setState({ project })  console.log(this.state.project.horarios)  }catch (response){  this.setState({ errorMessage: response.data.error})  }      }  async componentDidMount(){  this.getUser()  //console.log(this.state.project)  console.log(this.state.project)  }  /* this.getUser()  console.log(userID)  }*/    render(){  const tableData = this.state.project.horarios.map(horario =gt; console.log(horario.segunda) )  console.log(tableData)  return(  lt;View style={{backgroundColor: "#00ced1"}}gt;  lt;View style={styles.header}gt;  lt;View style={styles.headerContent}gt;  lt;View style={styles.avatar}gt;lt;Ionicons name="ios-person" style={{ marginLeft:6}} size={107}/gt;lt;/Viewgt;  lt;Text style={{ marginTop:0.5,marginBottom:10, alignItems:'flex-end', fontSize:25}}gt;{this.state.project.title}lt;/Textgt;  lt;/Viewgt;  lt;/Viewgt;   lt;View style={styles.profileDetail}gt;  lt;View style={styles.detailContent}gt;  lt;Text style={{fontSize:30}}gt;{this.state.project.speciality}lt;/Textgt;  lt;StarRating disabled={false} maxStars={5} rating={this.state.project.stars} selectedStar={(rating) =gt; this.onStarRatingPress(rating)}  starSize={20} starStyle= {{alignItems: 'center', }} containerStyle={{ width:140}} /gt;  lt;/Viewgt;  lt;/Viewgt;  lt;View style={styles.body ,{height:10000}}gt;  lt;View /*style={styles.buttonContainer2}*/gt;  lt;Text style={{fontSize:19, marginTop:30,marginLeft:10 }}gt;Contato (telefone) lt;Ionicons name="call-outline" style={{ marginLeft:6}} size={17}/gt;: {this.state.project.contato}lt;/Textgt;  lt;/Viewgt;  lt;View /*style={styles.buttonContainer2}*/gt;  lt;Text style={{fontSize:19 , marginTop:30,marginLeft:10 }}gt;Endereço lt;Ionicons name="home-outline" style={{ marginLeft:6}} size={17}/gt;: {this.state.project.address}lt;/Textgt;  lt;/Viewgt;   lt;View gt;  lt;Text style={{fontSize:19, marginTop:15,marginLeft:10}}gt;planos de atendimento lt;Ionicons name="map-outline" style={{ marginLeft:6}} size={17}/gt; : {this.state.project.planos}lt;/Textgt;  lt;/Viewgt;  lt;View style={styles.bodyContent}gt;  lt;View style={styles.buttonContainer2}gt;    lt;/Viewgt;          lt;/Viewgt;  lt;/Viewgt;        lt;/Viewgt;    )    }  }  

Спасибо вам за помощь

Комментарии:

1. this.setState не сразу обновляет состояние. Он будет обновлен в следующем рендере. Поэтому я думаю, что исправление состоит в том, чтобы проверить, правильно ли задано состояние. Если нет, вернитесь lt;divgt;Waiting...lt;/divgt; или что-то в этом роде.

2. @user2740650 не думаю, что в этом проблема, когда я не передаю карту, она возвращается нормально, но с картой значения волшебным образом становятся неопределенными

3. Ну , что-то в this.state.project.horarios.map undefined этом есть, поэтому используйте ведение журнала, чтобы выяснить, какое из них не определено. Дайте нам знать, что вы обнаружите.

4. И попробуйте if (!this.state?.project?.horarios) return lt;divgt;Waitinglt;/divgt; в первой строке render и посмотрите, что произойдет.