【问题标题】:React-native TextInput how to throttle onBlur functionReact-native TextInput如何限制onBlur功能
【发布时间】:2017-11-07 07:51:35
【问题描述】:

在我的 React Native 项目中,我有以下代码:

<TextInput onBlur={(e) => this.handleBlurCheck(e, ...otherParams)}/>

我想限制函数handleBlurCheck,但在 React Native 中,我不知道该怎么做。

另外,我需要event 参数。

【问题讨论】:

  • 通过节流,您的意思是您希望事件处理程序在给定时间内仅发生 N 次?
  • 在给定时间内只触发1次
  • 您可以使用 lodash,它有一个名为 debounce 的函数,可以完全满足您的需求。
  • 我知道,但是这里怎么用

标签: reactjs react-native


【解决方案1】:

假设您的组件中有一个名为handleBlurCheck 的函数,您可以创建一个新函数:

this.throttledHandleBlurCheck = _.throttle(this.handleBlurCheck, timeWindow)

然后,在您的渲染代码中:

<TextInput onBlur={(e) => this.throttledHandleBlurCheck(e,...otherParams) }/>

【讨论】:

  • 创建一个新函数?像这样:throttledHandleBlurCheck(e,subTitle,identifier){ this.throttledHandleBlurCheck = debounce(this.handleBlurCheck, this) } 不,它不起作用
  • 不,我写的表单已经创建了函数。例如,您可以将其放在组件构造函数中。
  • 但是函数throttledHandleBlurCheck 用于什么?空函数?我需要通过handleBlurCheck 传递参数;没有lodash,我能实现吗?
  • 当您使用throttle 时,它会创建一个包装给定函数的函数。您提供给新函数的任何参数都将传递给原始函数。
  • 不客气。如果答案解决了您的问题,请将其标记为已接受。这将防止其他人尝试回答相同的问题。
猜你喜欢
  • 1970-01-01
  • 2018-08-01
  • 1970-01-01
  • 2018-06-25
  • 2017-02-12
  • 2023-01-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多