React Native loop這個

Question

當我在地圖循環中放入onPress時，它不起作用。如何解決它？

var PageOne = React.createClass({ 
    _handlePress() { 
    this.props.navigator.push({id: 2,}); 
    }, 
    render() { 
     return (
     <View>   
      <TouchableOpacity onPress={this._handlePress}> //work here 
      <Text> One </Text> 
      </TouchableOpacity> 
      <View style={styles.albums}> 
      { 
      list.map(function(item, index){ 
       return (
       <TouchableOpacity key={index} onPress={this._handlePress}> //doesn't work hehre 
        <Text>{item}</Text> 
       </TouchableOpacity> 
      ) 
      }) 
      } 
      </View> 
     </View> 
    ); 
    } 
}); 

Answer 1

this指的是錯誤的情況下，你需要的範圍進行詞法約束，這就是脂肪箭頭功能會爲你做。

嘗試調用你的函數是這樣的：

onPress={() => this._handlePress() } 

此外，您還需要將地圖功能綁定到正確的上下文是這樣的：

<View style={styles.albums}> 
    { 
    list.map(function(item, index){ 
     return (
     <TouchableOpacity key={index} onPress={() => this._handlePress()}> 
      <Text>{item}</Text> 
      </TouchableOpacity> 
     ) 
    }.bind(this)) 
    } 
</View> 

或者這樣：

<View style={styles.albums}> 
    { 
    list.map((item, index) => { 
     return (
     <TouchableOpacity key={index} onPress={() => this._handlePress()}> 
      <Text>{item}</Text> 
     </TouchableOpacity> 
     ) 
    }) 
    } 
</View> 

我成立了一個工作項目here。

https://rnplay.org/apps/_PmG6Q