Кнопка автоматически нажата

#react-native

#react-native

Вопрос:

У меня есть простое приложение с классом приветствия, который перенаправляет на выбор класса. Выбор класса имеет 2 кнопки.

Моя проблема в том, что когда я перенаправляю на выбор класса, кнопка автоматически нажимается, и у меня срабатывает оповещение без нажатия.

Вы знаете, как это предотвратить?

 //Select.js
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, Image,ImageBackground, Linking, TouchableOpacity, Alert, Button } from 'react-native';
import { createStackNavigator, createAppContainer } from "react-navigation"

export default class Select extends React.Component {

  displayMessage1(){
    Alert.alert("hello1")
  }

  displayMessage2(){
    Alert.alert("hello2")
  }

  render() {
    return (
        <View>
          <ImageBackground
              source={require("./images/im1.jpg")}
              style={styles.imageBackground}>

                <View style ={{flex:0.3}}></View>

                <View style ={{flex:1}}>
                    <Text style ={styles.text}> myText</Text>
                </View>

                <Button
                  onPress={this.displayMessage1()}
                  title="go message 1"
                  color="#00aaf0"
                />

                <View style ={{flex:0.3}}></View>

                <Button
                  onPress={this.displayMessage2()}
                  title="go message 2"
                  color="#00aaf0"
                />

                <View style ={{flex:1}}></View>

          </ImageBackground>
        </View>
    )
  }
}
```
  

Ответ №1:

Вы запускаете сообщение displayMessage1 методом onClick вашей кнопки.

Вы должны сделать что-то вроде, чтобы при запуске события вызывался метод, привязанный к вашему классу.

 <Button
    onPress={this.displayMessage1.bind(this)}
    title="go message 1"
    color="#00aaf0"
    />

  

Ответ №2:

 <Button
  onPress={this.displayMessage1()} // <-- here
  title="go message 1"
  color="#00aaf0"
/>
  

Это потому, что вместо передачи ссылки на onPress prop вы фактически выполняете метод, поэтому при каждом рендеринге этого метода, если он вызывается.