[英]Not working onPress in nested TouchableOpacity
Hi my custom component is wrapped in TouchableOpacity like this.嗨,我的自定义组件像这样包装在 TouchableOpacity 中。
const profileOnClick = () => {
console.log('Card Clicked!');
};
export const InfluencerCard = props => {
const {influencer, navigation} = props;
return (
<TouchableOpacity onPress={() => profileOnClick()}>
<Card>
<Text>
{influencer.user.name}
</Text>
<Text>
{influencer.tags[0].name}
</Text>
</Card>
</TouchableOpacity>
);
};
In Homescreen在主屏幕中
<ScrollView>
{data.categoriesForHome.map(category => (
<Layout key={category.id}>
<Text>
{category.name}({category.total})
</Text>
<ScrollView horizontal={true}>
{category.influencerProfiles.map(profile => (
<View key={profile.id}>
<InfluencerCard influencer={profile} />
</View>
))}
</ScrollView>
</Layout>
))}
</ScrollView>
When I clicked my custom component InfluencerCard
, it doesn't do anything.当我单击我的自定义组件
InfluencerCard
,它什么也没做。 I wonder it is because that component is in other component, so parent component block clicking on custom component.我想知道是因为那个组件在其他组件中,所以父组件阻止点击自定义组件。 Or calling onPress function is wrong.
或者调用 onPress 函数是错误的。
But I tried without parent component, it was working.但是我在没有父组件的情况下尝试过,它正在工作。 What am I missing?
我错过了什么?
It was my mistake.这是我的错误。 The problem was not from code or components.
问题不是来自代码或组件。 I use Card component from @ui-kitten/components and it implements TouchableOpacity behind the scene.
我使用来自@ui-kitten/components 的 Card 组件,它在幕后实现了 TouchableOpacity。 So I don't need to wrap with TouchableOpacity again.So just do
所以我不需要再次用 TouchableOpacity 包装。所以就做
<Card onPress={() => profileClick()}></Card>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.