首页 > 解决方案 > TypeError:未定义不是一个对象(评估'this.state.project.horarios.map')

问题描述

我试图使用array.map函数在本机反应中渲染一个数组,但它返回未定义不是一个对象,当我不传递.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 => 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() => {
      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 => console.log(horario.segunda) )
      console.log(tableData)
      return(
        <View style={{backgroundColor: "#00ced1"}}>
          <View style={styles.header}>
            <View style={styles.headerContent}>
            <View style={styles.avatar}><Ionicons name="ios-person" style={{ marginLeft:6}} size={107}/></View>
            <Text style={{ marginTop:0.5,marginBottom:10, alignItems:'flex-end', fontSize:25}}>{this.state.project.title}</Text>
            </View>
          </View>   
          <View style={styles.profileDetail}>
            <View style={styles.detailContent}>
             <Text style={{fontSize:30}}>{this.state.project.speciality}</Text>
             <StarRating  disabled={false} maxStars={5}  rating={this.state.project.stars} selectedStar={(rating) => this.onStarRatingPress(rating)}
           starSize={20} starStyle= {{alignItems: 'center', }} containerStyle={{   width:140}} />
            </View>
          </View>
          <View style={styles.body ,{height:10000}}>
              <View /*style={styles.buttonContainer2}*/>
                <Text style={{fontSize:19, marginTop:30,marginLeft:10 }}>Contato (telefone) <Ionicons name="call-outline" style={{ marginLeft:6}} size={17}/>: {this.state.project.contato}</Text>
              </View>
              <View /*style={styles.buttonContainer2}*/>
                <Text style={{fontSize:19 , marginTop:30,marginLeft:10 }}>Endereço <Ionicons name="home-outline" style={{ marginLeft:6}} size={17}/>: {this.state.project.address}</Text>
              </View> 
              <View >
                <Text style={{fontSize:19, marginTop:15,marginLeft:10}}>planos de atendimento <Ionicons name="map-outline" style={{ marginLeft:6}} size={17}/> : {this.state.project.planos}</Text>
              </View>
            <View style={styles.bodyContent}>
              <View style={styles.buttonContainer2}>
                
              </View>
              
              
              
              
            </View>
          </View>
          
         
       
        </View>
          
      )
      
    }

}

感谢您的帮助

标签: node.jsarraysreact-native

解决方案


推荐阅读