我是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'));