1 min readJan 16, 2018
Awesome 👍
Is it working as you would expect now? There are different syntax styles that can be used. The public class fields syntax
is great for avoiding having to write things like this.function = this.function.bind(this)
.
You could also write the debounce
like this
class CloneInput extends React.Component {
handleInput = debounce(() => {
// handle input code, bound to component instance
}, this.props.delay)
render() {
return (
<input type="text" onChange={this.handleInput}/>
)
}
}
It likely looks a little cleaner and this way the debounce
call is with the handleInput
method. The only thing with this is if your component renders multiple input
that all use the same handleInput
method but it’s not necessary to debounce
all of their onChange
events. That comes down to design though 😃
Hope that helps!