未定义不是对象（评估'this.fetchData（）。'）

Question

本地函数在主渲染器内绘制一个场景。但我得到的错误，因为这问题的标题（不确定是不是和对象...）

这是我的功能块：

fetchData() { 
 
     const { params } = this.props.navigation.state;   
 
     
 
     fetch(REQUEST_URL+'&'+'cabnum='+params.cabreg) 
 
     .then((response) => response.json()) 
 
     .then((responseData) => {   
 
      //alert(params.cabreg); 
 
      Alert.alert('','Your driver is :'+responseData[0].driver); 
 
      return responseData; 
 
    
 
      }).done(); 
 
     }

和我的主要渲染是这样的：

render() { 
 
      const { params } = this.props.navigation.state; 
 
       
 
      return (
 
       <View> 
 
        <Text>{params.cabreg}</Text> 
 
        <View>{this.fetchData() 
 
          .then((responseData)=>{         
 
            return(<View style={styles1.rightContainer}> 
 
              <Image source={{uri: responseData[0].image}} style={styles1.thumbnail} /> 
 
              <View style={{flexDirection:'column',alignItems:'center'}}> 
 
               <Text style={styles1.title}>{responseData[0].reg}</Text> 
 
               <Text style={styles1.driver}>Driver:{responseData[0].driver}</Text> 
 
               <Text style={styles1.driver}>Cab Type:{responseData[0].ctype}</Text> 
 
               <Text style={styles1.driver}>Contact:{responseData[0].contact}</Text> 
 
              </View> 
 
              </View> 
 
              ); 
 
            } 
 
          ) 
 
         } 
 
        </View> 
 
       </View> 
 
      ); 
 
     }

Answer 1

这不是向视图呈现响应数据的正确方式。

试试这个：

render() 
{ 
const { params } = this.props.navigation.state 

return (
    <View> 
     <Text> 
      {params.cabreg} 
     </Text> 
     <View> 
      {this.fetchData()} 
     </View> 
    </View> 
) 
} 

和功能如下：

fetchData() 
{ 
const { params } = this.props.navigation.state 

fetch(REQUEST_URL + '&' + 'cabnum=' + params.cabreg) 
    .then(response => response.json()) 
    .then(responseData => { 
     //alert(params.cabreg); 
     Alert.alert('', 'Your driver is :' + responseData[0].driver) 
     return (
      <View style={styles1.rightContainer}> 
       <Image 
        source={{ uri: responseData[0].image }} 
        style={styles1.thumbnail} 
       /> 
       <View style={{ flexDirection: 'column', alignItems: 'center' }}> 
        <Text style={styles1.title}> 
         {responseData[0].reg} 
        </Text> 
        <Text style={styles1.driver}> 
         Driver:{responseData[0].driver} 
        </Text> 
        <Text style={styles1.driver}> 
         Cab Type:{responseData[0].ctype} 
        </Text> 
        <Text style={styles1.driver}> 
         Contact:{responseData[0].contact} 
        </Text> 
       </View> 
      </View> 
     ) 
    }) 
    .done() 
}