我的FlatList是无状态组件,当按下项目时,我想通过调用方法“handleOnPress”来处理onPress。我该怎么做 ??
以下是示例代码。
`
handleOnPress = () => {
.....
}
<SampleListView
data={prop.data}
onPress={this.handleOnPress}
/>
const SampleListView = (props: Props) => {
return (
<FlatList
style={styles.container}
data={props.data}
keyExtractor={item => item.id.toString()}
renderItem={renderItem}
/>
)
}
renderItem = ({ item }: { item: DataSample }) => {
return (
<TouchableWithoutFeedback onPress={ () => props.onPress}>
....
</TouchableWithoutFeedback>
)
}
`
最佳答案
你可以尝试一下吗?
handleOnPress = () => {
.....
}
<SampleListView
data={prop.data}
onPress={this.handleOnPress}
/>
const SampleListView = (props: Props) => {
return (
<FlatList
style={styles.container}
data={props.data}
keyExtractor={item => item.id.toString()}
renderItem={renderItem}
/>
)
}
renderItem = ({ item }: { item: DataSample }) => {
return (
<TouchableWithoutFeedback onPress={props.onPress}>
<View>
....
</View>
</TouchableWithoutFeedback>
)
}
请注意这2个链接。
https://facebook.github.io/react-native/docs/flatlist
TouchableWithoutFeedback with custom component inside doesn't fires onPress callback
不同之处在于,将回调作为参数并添加了View层。
关于reactjs - React-Native如何从列表中的项目处理onPress ???,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/52182859/