Reactjs - 处理程序未被事件触发

时间:2016-02-23 13:28:39

标签: javascript reactjs ecmascript-6

我是React和ES6的新手,所以这可能是我忽略的一个简单问题。

似乎onClick和onKeyDown事件(或那种情况下的任何事件)都没有触发(在本例中是runSearch函数):

import React from 'react';
import ReactDOM from 'react-dom';
import 'jquery';


var SearchBar = React.createClass({
runSearch: function(e) {
    console.log("Hello");
},
render: function() {

    return(
        <form action="#" >
            <div className="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
                <input className="mdl-textfield__input" type="text" onKeyDown={this.runSearch} id="search-text" />
                <label className="mdl-textfield__label" htmlFor="search-text">Search</label>
            </div>
            <label className="mdl-button mdl-js-button mdl-button--icon" onClick={this.runSearch}>
                <i className="material-icons">
                    search
                </i>
            </label>
        </form>
    );
}
});

var MainContainer = React.createClass({
render : function(){
    return(
    <div className="mdl-layout mdl-js-layout mdl-layout--fixed-drawer mdl-layout--fixed-header">
        <main className="main mdl-layout__content mdl-color--grey-100">
            <SearchBar />
        </main>
    </div>
    );
}
ReactDOM.render(<MainContainer />, document.getElementById('container'));

0 个答案:

没有答案