TouchableOpacity onpress無法正常運行原生列表視圖

Question

我在使用tabvewAnimated內部的列表視圖。現在我面臨問題，同時將onPress（）TouchableOpacity添加到行，其中每當頁面加載和我添加this.props.navigator.push（{id：8，}）時它會自動觸發;它給我的錯誤「未定義不反對（評估‘this.props.navigator.push’）」我使用Navigator和在Android上構建

這裏的應用程序是我的代碼：

const RecievedPage = React.createClass({ 

    getInitialState() { 
     let dataSource = new ListView.DataSource({rowHasChanged:(r1,r2) => r1.guid != r2.guid}); 
     return { 
      dataSource: dataSource.cloneWithRows(dataList), 
      loader:true, 
     } 
    }, 

    display(rowData){ 
     this.props.navigator.pop(); 
     ToastAndroid.show(rowData+"", ToastAndroid.SHORT); 
    }, 

    componentWillMount() { 
     let self = this; 
     SharedPreferences.getItem("sender_id", (value) => { 
      let user_id = value; 
      let url = BASE_URL; 
      fetch(url, { 
       method: "GET", 
       headers: { 
        "Accept": "application/json", 
        "Content-Type": "application/json", 
       }, 
      }) 
       .then((response) => response.json()) 
       .then((responseData) => { 
        if (responseData.responsecode === 1) { 
         Received = responseData.data; 
         if (Received.length === 0) { 
         ToastAndroid.show("No Data found", ToastAndroid.SHORT); 
         }else{ 
          self.setState({dataSource:this.state.dataSource.cloneWithRows(Received), loader:false}); 
         } 

        } 
        else { 
         ToastAndroid.show('please try again...', ToastAndroid.SHORT); 
        } 
       }) 
       .catch(e => { 
        // ToastAndroid.show('Error:Please try again...', ToastAndroid.SHORT); 
       }) 
       .done(); 
     }); 
    }, 



    renderRow(rowData, sectionID,rowID){ 

     let QrView = (rowData.qrImageUrl!== "")? 
      <TouchableOpacity activeOpacity={.5} onPress={() => this.display(rowData.qrImageUrl)} > 
      <Image 
       source={{uri:rowData.qrImageUrl}} 
       style={{height:40,width:40,margin:15}} 
       resizeMode="contain"/> 
      </TouchableOpacity> 
      : 
      <Text style={{fontSize : 18,marginTop:15,color:"black",margin:15}} >NA</Text>; 

     return <View key={sectionID}> 
      <View style={{ flex: 1,height:70,flexDirection: 'row',justifyContent: 'space-between'}}> 

       <Text style={{fontSize : 18,marginTop:15,color:"black"}} >{rowData.sender_name}</Text> 
       <View> 
        {QrView} 
       </View> 
      </View> 
     </View> 
    }, 


    render() { 
     return(
      <ListView dataSource={this.state.dataSource} 
         renderRow={this.renderRow} 
         enableEmptySections={true} 
         style={{backgroundColor:"white", }}/> 
     ); 
    }, 
}); 

Answer 1

你正在調用函數而不是傳遞函數。

此：

<TouchableOpacity activeOpacity={.5} onPress={this.display(rowData.qrImageUrl)}> 

應該是：

<TouchableOpacity activeOpacity={.5} onPress={() => this.display(rowData.qrImageUrl)}>