问题描述
我是 React Native 的新手,我使用了 FlatList
,它有 ListItem
作为组件:
<FlatList
style={styles.container}
data={items}
renderItem={({ item }) => (
<ListItem
title={item.title}
onPress={() => console.log("this is pressed",item.id)}
)}
/>
)}
keyExtractor={(item) => item.id.toString()}
/>
一切正常,只有
问题是:当用户滚动视图时,即 FlatList
手指被按下的点,该组件显示 touch
效果。我希望 touch
效果仅在按下该元素时发生,而不是在滚动时发生。有什么办法可以解决这个问题吗?
-
ListItem
的代码
import React from "react";
import { View,StyleSheet,TouchableHighlight } from "react-native";
import { AppText } from "./AppText";
import colors from "../config/colors";
import Swipeable from "react-native-gesture-handler/Swipeable";
function ListItem({title,onPress}) {
return (
<Swipeable renderRightActions={renderRightActions}>
<TouchableHighlight onPress={onPress}>
<View style={[{ backgroundColor },styles.container]}>
<View style={styles.textContainer}>
{title && <AppText style={styles.title}>{title}</AppText>}
</View>
</View>
</TouchableHighlight>
</Swipeable>
);
}
const styles = StyleSheet.create({
container: {
flexDirection: "row",padding: 10,},textContainer: {
marginLeft: 10,justifyContent: "center",title: {
fontWeight: "900",});
export default ListItem;
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)