React Native中Alert跳转页面方法及OnPress不触发函数问题

一、React Native中Alert能否结合页面跳转？ #

完全可以。你只需要在Alert按钮的onPress回调里调用页面导航方法即可，比如使用React Navigation的navigation.navigate()（前提是组件已获取到navigation对象）。示例如下：

Alert.alert(
  '跳转提示',
  '是否跳转到详情页？',
  [
    { text: '取消', style: 'cancel' },
    { 
      text: '确定', 
      onPress: () => navigation.navigate('DetailScreen') 
    }
  ]
);

二、Alert按钮无法触发函数的问题修复 #

你代码里的问题在于onPress的写法错误：当前箭头函数仅返回函数引用，没有真正调用执行函数。正确写法有两种：

修正后的代码： #

const touchHandler = () => {
  if (true) {
    Alert.alert(
      'Choose Action', 
      'Would you like to take a picture or select an existing one?', 
      [
        { 
          text: 'Select from gallery', 
          onPress: () => retrieveImageHandler() // 加括号调用函数
        }, 
        {
          text: 'take a picture ', 
          onPress: takeImageHandler // 无参数时直接传函数引用
        }
      ]
    );
  }
};

错误原因说明： #

• 原写法()=> retrieveImageHandler：箭头函数返回的是retrieveImageHandler函数本身，但未执行，所以点击按钮不会触发逻辑。
• 改成()=> retrieveImageHandler()：箭头函数内部调用了目标函数，点击时会执行对应逻辑。
• 若函数无需传参，直接写onPress: takeImageHandler即可，点击时会直接执行该函数。

内容的提问来源于stack exchange，提问作者Ephrat Negussie