node.js - 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>
)
}
}
感谢您的帮助
解决方案
推荐阅读
- javafx - 如何在选中/取消选中复选框时显示和隐藏图像?
- jquery - 如何基于MVC JsonResult在页面加载时动态设置默认的boostrap选项卡
- ruby-on-rails - Rails - 为“/admin”添加自定义路由约束
- java - 无法从 JavaTable 获取单元格数据
- go - Go http 响应几个标头
- python - Django 模板:从显示用户列表中排除 request.user
- javascript - 未捕获的类型错误:未定义“绝对”。绝对是画布的定位
- css - 使引导导航栏黯然失色的空白区域
- haskell - 有条件地按顺序将函数应用于值
- javascript - 为什么会给出这样的结果?