[英](react) debounce with arguments
I'm trying to debounce a function (using underscore's debounce) passed as a prop to a component. 我试图去抖动作为道具传递给组件的函数(使用下划线的去抖动)。 I've been able to do this in the past with the following:
我过去可以做到以下几点:
componentWillMount() {
this.handleInputTextChangeDebounced = debounce(() => {
console.log('I debounce!');
}, 250);
},
That works fine and dandy, but now I need to access the event argument (so I can get the value from the input) from the onChange which triggeres the handleInputTextChangeDebounced
那很好并且很花哨,但是现在我需要从onChange上访问事件参数(这样我就可以从输入中获取值),它会触发
handleInputTextChangeDebounced
eg: 例如:
<input onChange={this.handleInputTextChangeDebounced} data-option='buildNumber' />
I can't simply use a ref because I have many form input options that I want to use with thise debounced function. 我不能简单地使用ref,因为我有很多要与thise debounced函数一起使用的表单输入选项。
I tried to return the debounce as a function within the handleInputTextChangeDebounced which would receive the event, but that appears to stop the debouncing from working. 我试图将debounce作为handleInputTextChangeDebounced中的函数返回,该函数将接收该事件,但这似乎阻止了反跳工作。
Suggestions? 建议?
Figured out a solution using two steps. 使用两个步骤找出解决方案。 I called a normal class function (
handleInputTextChange
) where I extracted the value from the input field, then I called the debounced function ( handleInputTextChangeDebounced
) separately. 我调用了一个普通的类函数(
handleInputTextChange
),在其中从输入字段中提取了值,然后分别调用了去抖动的函数( handleInputTextChangeDebounced
)。
handleInputTextChange(e) {
this.handleInputTextChangeDebounced(e.target.value);
},
handleInputTextChangeDebounced: debounce((value) => {
// do debounced stuff with value here...
}, 700),
<input onChange={this.handleInputTextChange} type='text' data-option='buildNumber' />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.