Как передать данные от дочернего компонента его родителю в ReactJS?
Я пытаюсь отправить данные из дочернего компонента в родительский компонент следующим образом:
const ParentComponent = React.createClass({
getInitialState() {
return {
language: '',
};
},
handleLanguageCode: function(langValue) {
this.setState({language: langValue});
},
render() {
return (
<div className="col-sm-9" >
<SelectLanguage onSelectLanguage={this.handleLanguage}/>
</div>
);
});
а вот дочерний компонент:
export const SelectLanguage = React.createClass({
getInitialState: function(){
return{
selectedCode: '',
selectedLanguage: '',
};
},
handleLangChange: function (e) {
var lang = this.state.selectedLanguage;
var code = this.state.selectedCode;
this.props.onSelectLanguage({selectedLanguage: lang});
this.props.onSelectLanguage({selectedCode: code});
},
render() {
var json = require("json!../languages.json");
var jsonArray = json.languages;
return (
<div >
<DropdownList ref='dropdown'
data={jsonArray}
value={this.state.selectedLanguage}
caseSensitive={false}
minLength={3}
filter='contains'
onChange={this.handleLangChange} />
</div>
);
}
});
Что мне нужно, это получить выбранное значение пользователем в родительском компоненте. Я получаю эту ошибку:
Uncaught TypeError: this.props.onSelectLanguage is not a function
Может кто-нибудь помочь мне найти проблему?
Постскриптум Дочерний компонент создает раскрывающийся список из файла json, и мне нужен раскрывающийся список, чтобы показать оба элемента массива json рядом друг с другом (например, «aaa, english» в качестве первого выбора!)
{
"languages":[
[
"aaa",
"english"
],
[
"aab",
"swedish"
],
}