如何在卡上添加onPress事件(在本机基础上)?
问题描述:
我试图让点击重定向到另一个屏幕的卡,但我不能弄明白如何在卡上添加onPress事件(在本机基础上)?
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>))
答
您可以通过TouchableOpacity
包裹整卡使<Card />
点击。另外不要忘记为每张卡片添加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>
))
从哪个库导入'Card'? –
from'native-base' –
我会回答@Guilherme –