react-native - TouchableOpacity.onPress 事件未触发

Question

我有 2 个文本，我想导航到不同的页面，但我需要它们之间的图像......但是图像上方的文本（在本例中为“wc 项圈”）无法导航并且不可点击，但是当我删除它工作的图像......我什至尝试删除可触摸的不透明度并将onpress添加到文本中，但它仍然产生相同的结果

<View>
  <View style={styles.container}>
    <View>
      <TouchableOpacity
        onPress={() => navigation.navigate('Collar')}
        style={{ width: 90, height: 40 }}
      >
        <Text style={styles.textstyle}> WC COLLAR</Text>
      </TouchableOpacity>
    </View>
    <View>
      <TouchableOpacity
        onPress={() => navigation.navigate('Circlet')}
        style={{ width: 90, height: 40 }}
      >
        <Text style={styles.textstyle2}> WC CIRCLET</Text>
      </TouchableOpacity>
    </View>
  </View>
  <View style={styles.container}>
    <Image
      source={require('../images/portlog.png')}
      style={{ width: 1366, height: 650, position: 'absolute', top: 200 }}
    />
    <StatusBar style="auto" />
  </View>
</View>