React Native - Pressable longpress 上的連續文本輸入刪除

Question

我有一個小問題，當我嘗試使用 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>

提前致謝！

Answer 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）要求對可按壓的一個clearInterval功能，當onPressOut函數被調用來清除timerInterval在onLongPress聲明

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

這是針對您的問題的完整工作解決方案/示例： https : //snack.expo.dev/@gavindmello97/pressable-deletion

希望能幫到你。 如果是這樣，請將我的答案標記為正確答案，以便其他人也可以從中受益。 如果您在我的代碼中遇到任何問題，請給我留言/評論。 很高興幫助你。