代码之家 › 专栏 › 技术社区 › bananajoey88

React Native:TouchableOpacity移除延迟

touchableopacity expo button react-native

bananajoey88 · 技术社区 · 1 年前

我有一个计算器应用程序,里面有很多按钮(TouchableOpacity的),当用户一个接一个地快速按下很多按钮时,问题就会出现:第一次按下按钮可能会被处理,但其他按下按钮会被忽略,因为onPress事件的延迟太高。如何消除延迟,使onpress事件立即启动?

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

我还尝试过使用 可触摸无反馈 , 可按下 ,以及同样没有消除延迟的onPressIn、pressInDelay属性

2 回复 | 直到 1 年前

Yathish Acharya 1 年前

使用不同的可触摸组件:TouchableWithoutFeedback 可能对您的用例更具响应性。

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

Jatin Bhuva 1 年前

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;

推荐文章