TouchableHighlight onPress не работает

Я внедрил страницу с объявлениями, которая работала до тех пор, пока я не обновил реакцию.

Проблема, с которой я столкнулась, заключается в том, что propp onPress не вызывается:

<TouchableHighlight style={styles.button}
        underlayColor='#f1c40f'
        onPress={this.signIn}>
   <Text style={styles.buttonText}>Sign In</Text>
</TouchableHighlight>

Вот моя функция signIn:

signIn: function(){
console.log("SignInAction signIn")
this.fetchData();  },

При нажатии кнопки signIn появляется нажатие, но оператор журнала не запускается.

Ответ 1

Попробуйте вызвать его так:

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

Похоже, что "this" в вашей функции привязан к неправильной области.

Ответ 2

вы также можете сделать это следующим образом:

onPress={this.signIn.bind(this)}>

остальная часть кода не нуждается в изменении.

Ответ 3

Кроме того, если вы не хотите использовать bind, и поскольку мы используем синтаксис ES6, вы можете написать свою функцию, назначаемую как const (внутри вашего компонента), а не функцию, например:

signIn = () => {
  // code here
}

то вы все равно можете вызвать его внутри компонента, как вы уже есть, без необходимости связывать внутри конструктора или где-либо еще:

<TouchableHighlight style={styles.button}
        underlayColor='#f1c40f'
        onPress={this.signIn}>
   <Text style={styles.buttonText}>Sign In</Text>
</TouchableHighlight>

Это должно поддерживать согласование "this", так как signIn будет привязан к компоненту только один раз при инициализации.