react-native - 当列表中有短暂的触摸时，onPress 立即在 ListItem 中触发

Question

React Native Elements 版本 - 0.19.1，React Native - 0.57.8

我一直在使用 React Native 元素来构建设置屏幕，并且效果很好。但是，我已经使用卡片和列表项在卡片视图中显示列表视图。这是卡片视图中列表视图的代码。

<View style = { styles.settingsCardContainerStyle }>
                <Card>
                    {
                        list.map((item, i) => (
                        <ListItem
                            key={i}
                            title={item.name}
                            leftIcon={{ name: item.icon }}
                            onPress= {() => this.props.navigation.navigate(item.screenName)}
                            activeOpacity={0.7}
                            containerStyle= {{
                                borderBottomWidth: 0.2,
                            }}

                        />
                        ))
                    }
                </Card>
            </View>

并且列表正确呈现，实际问题是当我进行滑动或滚动或其他操作时，onpress 会立即触发。换句话说，如果我在列表视图上进行自然滚动，第一项将触发。如何将按下事件延迟 0.5 秒。当我使用 onLongpress 时，它可以正常工作，但至少需要 1 秒以上才能工作。我试图减少 longpres 的持续时间，但似乎没有用。

我现在应该做什么，有什么方法可以将 onpress 事件延迟几毫秒，或者如何将 onlongpress 减少 0.3 或 0.4 毫秒，这将与正常用户使用或触摸相匹配。

标签： react-nativereact-native-elements

Answer 1

使用 lodash js 的 debounce

()=> debounce(function() {
this.props.navigation.navigate(item.screenName)}, 300);