单击两侧时，可触摸的不透明度不起作用

Question

单击按钮边缘时，可触摸不透明度不起作用。它仅在单击按钮中心时有效。为什么会发生这种行为？

代码

<TouchableOpacity style={{flexDirection:'row',marginTop:20,alignSelf:'center',alignItems:'center',justifyContent: 'center',width:'80%',height:60,backgroundColor:'#140F79',borderRadius:20}}>
    <Icon name="plus" size={15} color="white"   />
    <Text style={{fontFamily:'Montserrat-Bold',margin:10,fontSize:20,color:'white'}} onPress={()=>showAstro(itemdeets)}>Add to Cart</Text>
</TouchableOpacity>

Answer 1

您应该在 TouchableOpacity 而不是 Text 上处理 onPress。它仅在 Text.

上检测到按下

<TouchableOpacity style={{flexDirection:'row',marginTop:20,alignSelf:'center',alignItems:'center',justifyContent: 'center',width:'80%',height:60,backgroundColor:'#140F79',borderRadius:20}} onPress={()=>showAstro(itemdeets)}>
    <Icon name="plus" size={15} color="white"/>
    <Text style={{fontFamily:'Montserrat-Bold',margin:10,fontSize:20,color:'white'}}>Add to Cart</Text>
</TouchableOpacity>

单击两侧时，可触摸的不透明度不起作用

Touchable opacity not working when clicked on the sides

react-native

touchableopacity

代码