Question

有人可以告诉我为什么在应用程序运行时我的警报会弹出来吗？

这是我的组件的源代码

import React from 'react';
import { Text, TouchableOpacity, Alert } from 'react-native';

const Button = () => {
  const { buttonStyle, textStyle } = styles;
  return (
    <TouchableOpacity onPress={Alert.alert('A', 'B')} style={buttonStyle}>
    <Text style={textStyle}> Log </Text>
    </TouchableOpacity>
  );
};

const styles = {

  textStyle: {
    alignSelf: 'center',
    color: '#27b535',
    fontSize: 16,
    fontWeight: '600',
    paddingTop: 10,
    paddingBottom: 10

  },

  buttonStyle: {
    //flex: 1,
    alignSelf: 'stretch',
    backgroundColor: '#fff',
    borderRadius: 5,
    borderWidth: 1,
    borderColor: '#27b535',
    marginLeft: 5,
    marginRight: 5
  }

};

export default Button;

从上面的源代码中可以看出，我按下按钮时会弹出一个警告但发生的情况是，只要我的应用程序运行，就会显示此警告框，并且当我显示警告框时实际点击按钮。

有人可以解释一下为什么会这样吗？

Answer 1

我知道它已经得到解答，但要解决其他错误，请添加以下答案：

您应该使用函数来调用getState()["_root"]["entries"][0]["place_id"]而不是直接使用它感谢@ KhalilKhalaf指出它。 ref link

您错过了Alert

() =>

另外

showAlert = () =>
{
  Alert.alert('A', 'B');
}

<TouchableOpacity onPress={this.showAlert} style={styles.buttonStyle}>

Answer 2

您需要将该功能传递给onPress。您现在正在调用alert，而不是传递要在onPress

中调用的函数

<TouchableOpacity onPress={() => Alert.alert('A', 'B')} style={buttonStyle}>

Answer 3

您经常需要将函数作为属性传递以供稍后执行。

() => ...定义箭头功能。

更改此

onPress={Alert.alert('A', 'B')}

到

onPress={() => Alert.alert('A', 'B')}

React Native：为什么在点击按钮之前会显示警报？

3 个答案: