将 Lodash _.throttle() 与 ReactJS 结合使用

Question

我正在尝试使用 Lodash 节流功能来节流文本输入上的 onChangeText 事件。但这似乎没有任何区别：

<TextInput {...this.c('tokenInput')}
    onChangeText={ _.throttle((text) => {
        this.onChangeText(text)
    }, 1000) }
    value={this.state.text}
    placeholder='Select...'
/>

我怎样才能完成这项工作？每次我在输入中输入内容时，每次更改都会继续执行 onChangeText()。

Answer 1

onChange 必须是一个函数，但在您的上下文中它是一个函数调用。所以要解决这个问题，你必须这样做：

<TextInput {...this.c('tokenInput')}
    onChangeText={ text => _.throttle(x => {
        this.onChangeText(x)
    }, 1000)(text) }
    value={this.state.text}
    placeholder='Select...'
/>

将 Lodash _.throttle() 与 ReactJS 结合使用

Using Lodash _.throttle() with ReactJS

javascript

underscore.js

lodash

reactjs