0

当我尝试使用 Pressable 进行 onLongPress 时,我有点担心。与之关联的函数只被调用一次。

当我按住可按下时,如何让它连续删除 textInput 上的值?

示例代码:

<Pressable
              style={({ pressed }) => [
                styles.deleteStyle,
                {
                  opacity: pressed
                    ? 0.5
                    : 1,
                }]}
              onPress={() => { delDigit() }}
              onLongPress={() => { delDigit() }}
            >
              <Icon style={[{ color: '#FD6B89' }]} name="backspace" size={30} />
            </Pressable>

提前致谢!

4

1 回答 1

1

一个非常简单的解决方案是在按住 Pressable 按钮时调用 onLongPress 函数时使用 setInterval 函数。您可以使用 clearInterval 停止从 textInput 中删除文本。

脚步:

a) 在调用 onLongPress 函数时在 Pressable 上调用 setInterval 函数,并在每个间隔中从 textInput 中删除值字符串的最后一个元素。

onLongPress={() => {
   this.timer = setInterval(() => {
      this.setState({
          email: this.state.email.substring(0,this.state.email.length - 1)
      })
   },200)
}}

b) 在调用 onPressOut 函数时,在 Pressable 上调用 clearInterval 函数清除 onLongPress 中声明的timerInterval

    onPressOut={() => {
      clearInterval(this.timer)
    }}

这是您问题的完整工作解决方案/示例: https ://snack.expo.dev/@gavindmello97/pressable-deletion

希望对您有所帮助。如果是这样,请将我的答案标记为正确答案,以便其他人也可以从中受益。如果您对我的代码有任何问题,请给我留言/评论。很高兴为您提供帮助。

于 2021-11-17T01:35:01.317 回答