我正在尝试将lodash的debouncing添加到搜索函数中,从输入onChange事件调用.下面的代码生成一个类型错误’function is expected’,我理解,因为lodash期待一个函数.这样做的正确方法是什么,可以全部内联完成吗?到目前为止,我几乎尝试了所有的例子都无济于事.
search(e){ let str = e.target.value; debounce(this.props.relay.setVariables({ query: str }),500); },
debounce函数可以在JSX中内联传递,也可以直接设置为类方法,如下所示:
search: _.debounce(function(e) { console.log('Debounced Event:',e); },1000)
小提琴:https://jsfiddle.net/woodenconsulting/69z2wepo/36453/
如果您使用的是es2015,则可以直接在构造函数或componentWillMount等生命周期方法中定义debounce方法.
例子:
class DebounceSamples extends React.Component { constructor(props) { super(props); // Method defined in constructor,alternatively could be in another lifecycle method // like componentWillMount this.search = _.debounce(e => { console.log('Debounced Event:',e); },1000); } // Define the method directly in your class search = _.debounce((e) => { console.log('Debounced Event:',e); },1000) }