2
現在、私はSoundcloud APIを使用していますが、配列に返されたユーザーを格納してから、配列を親オブジェクトにsetStateしようとしています。問題は、console.logに配列が含まれているが空であることを示す更新された状態です。以下は、私のコードの例を次に示します。親コンポーネントの状態に配列を追加する
SC.get('/users', { q: this.state.search, limit: 10 }, function(users) {
this.setState({ avatar: users });
}.bind(this));
もavararをchnage
var SearchBar = React.createClass({
getInitialState: function(){
return {search : '',
avatar : '',
}
},
onChange: function(e){
e.preventDefault();
this.setState({search: e.target.value});
console.log('does this work', this.state.search)
},
onClick: function(e){
e.preventDefault();
},
getData: function(){
var userAv = [];
SC.get('/users', { q: this.state.search, limit: 10 }, function(users){
_.each(users, function(obj){
userAv.push(obj);
});
console.log('What is userAv', userAv);
})
this.setState({ avatar: userAv}, function(){
console.log('What is this.state.avatar', this.state.avatar)
});
},
render: function(){
return (
<div id='search-container'>
<input
onChange={this.onChange}
id='search-bar'
type = 'text'
value={this.state.search}
placeholder = 'Search For Artist here'
/>
<button
id="search-button"
onClick={this.getData}
type = 'button'>
Submit
</button>
<UserList />
</div>
)
}
});
'this.state.search'を更新するのは' e.target.value（） 'だけです。私はあなたが 'setState（{search：}'をしているところを見ないか、 'avatar'を更新しようとしていますか？ –
私はアバターを更新しようとしています – DLF85
まあ、 ''タグは[React special]（https://facebook.github.io/react/docs/forms.html）であり、通常の要素とは異なる扱いが必要です。これもあなたのプログラムに影響するかもしれません。 –