0
私はreact.jsを学んでいます。ユーザーのGitHub APIを使って簡単な検索エンジンを開発しています。React：検索結果が表示されていませんか？
プロジェクトのAPI側が正常に動作します（私は手動エリアに名前を入力することによってテストされています）
その検索がでビルドするには、それが動作していない反応。
：
script.jsx
var Card = React.createClass({
getInitialState: function(){
return{};
},
componentDidMount: function(){
var component = this;
$.get("https://api.github.com/users/" + this.props.login, function(data){
component.setState(data);
});
},
render: function(){
return(
<div>
<img src={this.state.avatar_url} width="100"/>
<h3>{this.state.name}</h3>
<hr/>
</div>
);
}
});
var Form = React.createClass({
handleSubmit: function(e){
e.preventDefault();
var loginInput = React.findDOMNode(this.refs.login);
this.props.addCard(loginInput.value);
loginInput.value = '';
},
render: function(){
return(
<form onSubmit={this.handleSubmit}>
<input placeholder="Enter Github Name" ref="login"/>
<button>Search</button>
</form>
);
}
});
var Main = React.createClass({
getInitialState: function(){
return {logins: []};
},
addCard: function(loginToAdd){
this.setState({logins: this.state.logins.concat(loginToAdd)});
},
render: function() {
var cards = this.state.logins.map(function(login){
return (<Card login={login} />);
});
return(
<div>
<Form addCard={this.addCard} />
{cards}
</div>
)
}
});
ReactDOM.render(<Main />, document.getElementById("root"));
plunkrへのリンクは役に立つでしょう – jzm
あなたはどんな結果を期待していますか？ –
@jzm大胆なリンクsry -https：//plnkr.co/edit/T7Xm92j20wRzatyx6Uyh？p = info – ClarkPamler93