React 组件将代理对象而不是事件对象传递给处理程序函数



我准备了以下 React 组件(React 版本 1.5.2):

var QuickSearch = React.createClass({
    searchHandler: function(){
        this.props.parent.props.dataSource.search = this.refs.SearchInput.value;
        this.props.parent.props.dataSource.setPage(1);
        this.props.parent.getData();
    },
    refreshHandler: function(){
        this.props.parent.props.dataSource.search = this.refs.SearchInput.value;
        this.props.parent.getData();
    },
    myEventHandler: function(evt){
        console.log(evt);
        if(evt.keyCode === 13) {
            evt.stopPropagation();
            this.searchHandler();
        }
    },
    render: function(){
        /* Translation function from table model */
        _ = this.props.parent.props.table_model.gettrans;
        return(
            <div className="reactable-quicksearch-wrapper">
                <input ref="SearchInput" type="text" onKeyPress={this.myEventHandler} placeholder={_('Search phrase...')} />
                <button ref="SearchButton" type="button" onClick={this.searchHandler}>{_('Search')}</button>
                <button ref="RefreshButton" type="button" onClick={this.refreshHandler}>{_('Refresh')}</button>
            </div>
        );
    }
});

myEventHandler 函数作为 "evt" 传递包含 "target"(基本上是一个输入)和处理程序的代理对象:

Proxy { <target>: Object, <handler>: Object }

我不知道为什么,但它的行为似乎像"提交"(??无论如何,从我读到的内容来看,react 应该传递标准事件对象,但它没有。

什么会导致这种行为?

这是预期的行为。React 不使用本机事件来解决浏览器的不一致问题,而是使用 SyntheticEvents。不过有些东西看起来很奇怪。IIRC 类名是 SyntheticEvent,而不是 Proxy。

相关内容

  • 没有找到相关文章

最新更新