React.js和去抖onChange事件不工作

我已经实现反应组件上改变事件是这样的：https://stackoverflow.com/a/28046731/842622 React.js和去抖onChange事件不工作

：

NewItem = React.createClass({ 

    componentWillMount: function() { 
    this._searchBoxHandler = debounce(this._searchBoxHandler, 500); 
    }, 

    _searchBoxHandler: function(event) { 
    this.context.flux.getActions('order').setOrders(...); 
    }, 

    render: function() { 
    ... 
    var _self = this; 
    return (<TextField onChange={_self._searchBoxHandler} />)  
    }) 

});

我已经通过检查这个答案（好主意部分）做到了这一点FPGA实现

但它不起作用。我总是从事件对象中'无法读取'null'属性值'。

我失去了一些东西在这里？

来源

2016-10-11 Mirat Can Bayrak

如果不去除处理程序，会发生什么情况？你使用的是什么去抖功能？下划线的？ –

顺便说一句，你可以在你的渲染中使用'this'，而不必在渲染函数中创建一个新的引用保持器： 'var _self = this; 返回（）' == '返回（）' –

@mirat这篇溶液帮助？ –

你需要绑定你的环境，或使用一个关闭，保持划定范围：

NewItem = React.createClass({ 
 

 
    componentWillMount: function() { 
 
    this._searchBoxHandler = debounce(this._searchBoxHandler.bind(this), 500); 
 
    }, 
 

 
    _searchBoxHandler: function(event) { 
 
    this.context.flux.getActions('order').setOrders(...); 
 
    }, 
 

 
    render: function() { 
 
    ... 
 
    var _self = this; 
 
    return (<TextField onChange={_self._searchBoxHandler} />)  
 
    }) 
 

 
});

新的JavaScript程序员一个常见的错误是从一个对象中提取的方法，然后稍后调用该函数，并期望它将原始对象用作其本身（例如，通过在基于回调的代码中使用该方法）。然而，如果不特别注意，原始物体通常会丢失。创建从功能绑定功能，使用原来的对象，巧妙地解决了这个问题.. - MDN

上绑定和上下文一些不错的文档： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

，或者您可以使用“胖箭头“功能访问父类范围：

debounce((event) => { this._searchBoxHandler(event); }, 500);

注：我不会覆盖在componentWillMount INV声明的功能特性而不是你可以在另一个属性中存储去抖实例，如_debouncedSearchBoxHandler

来源

2016-10-11 15:43:05

React.js和去抖onChange事件不工作

回答

相关问题