TouchableOpacity 消除延迟

Question

我有一个带有很多按钮（TouchableOpacity）的计算器应用程序，当用户快速按下多个按钮时就会出现问题：第一个按钮按下可能会得到处理，但其他按钮按下将被忽略因为 onPress 事件的延迟太高。如何消除该延迟以便立即触发 onpress 事件？

<TouchableOpacity
  activeOpacity={0.7}
  onPress={() => console.log("test")}
>
    This is a button
</TouchableOpacity>

我还尝试使用 TouchableWithoutFeedback、Pressable，以及 onPressIn、pressInDelay 属性，但也没有消除延迟

Answer 1

使用不同的可触摸组件：TouchableWithoutFeedback 可能会更适合您的用例。

<TouchableWithoutFeedback onPress={handlePress}>
        <View>
          <Text>This is a button</Text>
        </View>
      </TouchableWithoutFeedback>
    </View>

Answer 2

React Native 的 TouchableOpacity 具有内置延迟以防止多次触摸。您可以尝试使用delayPressIn属性禁用它：

尝试以下也许可行：

import React from 'react';
import { TouchableOpacity, Text } from 'react-native';

const MyButton = () => {
  return (
    <TouchableOpacity
      activeOpacity={0.7}
      delayPressIn={0}
      onPress={() => console.log("test")}
    >
      <Text>This is a button</Text>
    </TouchableOpacity>
  );
};

export default MyButton;