gpt4 book ai didi

react-native - 如何在卡片上添加 onPress 事件(在 native 基础上)?

转载 作者:行者123 更新时间:2023-12-04 05:11:04 26 4
gpt4 key购买 nike

我正在尝试使这些卡片可点击以重定向到另一个屏幕,但我无法弄清楚

 let cards = this.state.items.map(item => (
<Card key={item.id} onPress={() => Actions.dogScreen()}>
<CardItem bordered>
<Left>
<Thumbnail square source={item.image ? { uri: "data:image/jpeg;base64," + item.image } : logo} />
<Body>
<Text>Name: {item.name}, Age: {item.age}</Text>
<Text note>Gender: {item.gender.name} Race: {item.race.name}</Text>
</Body>
</Left>
</CardItem>
</Card>))

最佳答案

您可以制作 <Card />可通过将整张卡片包裹在 TouchableOpacity 来点击.另外不要忘记添加pointerEvents="none"每张卡。

import { TouchableOpacity } from 'react-native';

let cards = this.state.items.map(item => (
<TouchableOpacity key={item.id} onPress={() => Actions.dogScreen()}>

<Card pointerEvents="none">
<CardItem bordered>
<Left>
<Thumbnail square source={item.image ? { uri: "data:image/jpeg;base64," + item.image } : logo} />
<Body>
<Text>Name: {item.name}, Age: {item.age}</Text>
<Text note>Gender: {item.gender.name} Race: {item.race.name}</Text>
</Body>
</Left>
</CardItem>
</Card>

</TouchableOpacity>
))

关于react-native - 如何在卡片上添加 onPress 事件(在 native 基础上)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47362032/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com