реагируют родное событие onPress не работает в цикле

Question

Мой код Класс

проблема заключается onPress функция дает следующее сообщение об ошибке, если я использую его в петле

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

ничего не происходит, если я использую эту строку кода

onPress={this.onPressButton} 

Я знаю, что должен сделать что-то с обязательными, которые я не получаю любезно помочь

export default class PlayGame extends Component { 

    navigate(routName){ 
    this.props.navigator.push({ 
    name: routName 
    }) 
    } 

    onPressButton() { 
    alert("You tapped the button!"); 
    } 

    render() { 
    //var selectedLetter = Globals.URDU_ALPHABETS[Math.floor(Math.random()*Globals.URDU_ALPHABETS.length)]; //will be used when app is MVP 
    //add selected array 

    var selectedLetter = Globals.URDU_ALPHABETS[1]; 
    var randLetters = shuffle(randomLetters(Globals.URDU_ALPHABETS,selectedLetter)); 
    playSelectedLetter(selectedLetter.name);  
    return (    
    <View style={{flex: 3,backgroundColor: 'silver', flexDirection: 'column', justifyContent:'space-between', alignItems: 'center'}}>      
    <View style={{width: 400, height: 8, flex: 1, backgroundColor: 'steelblue'}} /> 
    <View style={{flex: 3,backgroundColor: 'silver', flexDirection: 'row', justifyContent:'space-between', alignItems: 'center'}}> 

    {Object.keys(randLetters).map(function(key,index) { 

     return <TouchableHighlight key={index} letterName={randLetters[key].name} onPress={() => this.onPressButton()} > 
     <View style={{width: 50, height: 50, backgroundColor: 'skyblue'}} key={index}><Text key={index} >{randLetters[key].name}</Text></View> 
     </TouchableHighlight> 

    } 
    )} 
    </View>  
    <TouchableHighlight onPress={this.onPressButton}> 
    <Text>Button</Text> 
    </TouchableHighlight> 
    <View style={{width: 0, height: 0, backgroundColor: 'skyblue'}}><Text></Text></View>    
    </View> 
); 
} 

Answer 1

Попробуйте изменить:

Object.keys(randLetters).map(function(key,index) { 

к:

Object.keys(randLetters).map((key,index) => { 

Вы можете связать либо в конструкторе класса или этих двух способов визуализации

{this.onPressButton.bind(this)}  {() => this.onPressButton()} 

Answer 2

Вы должны привязать его к вашему компоненту контекста:

export default class PlayGame extends Component { 

    constructor(props) { 
     super(props); 

     this.onPressButton = this.onPressButton.bind(this) 
    } 
}