Учу React.
Есть два компонента, MainComponent и вложенный в него Child .... как вывести в главном компоненте, данные из вложенного?
import .......;
class MainComponent extends Component {
state = {
mainValue: 'mainValue'
};
outValues() {
let inputName = this.inputName.value;
let inputChild = ???????? ;
console.log('ЗНАЧЕНИЕ КОМПОНЕНТА input:', inputName);
console.log('ЗНАЧЕНИЕ параметра value компонента Child :', ??????? );
console.log('ЗНАЧЕНИЕ поля Child.valueAAAA компонента Child :', ??????? );
console.log('ЗНАЧЕНИЕ state.valueBBBB компонента Child :', ??????? );
}
render() {
return (
<div>
name:
<input type="text" ref={(input) => {this.inputName = input}}/>
<Child ref={/* что писать сюда чтобы */} value="значение_А" onValue={this.onValueOrderStatusSelect.bind(this)}/>
<button onClick={this.outValues.bind(this)}> TEST </button>
</div>
);
}
onValueCategorySelect(e) {
this.setState({mainValue: e.target.value});
}
}
и
class Child extends Component {
state = ({
valueBBBB: 'значение_valueBBBB'
})
valueAAAA = 'значение_valueAAAA';
render() {
let options = [];
let name = "id";
this.props
.categories
.forEach((category,index) => {
options.push(
<option key={index} value={JSON.stringify(category)}>{category[name]}</option>
)
})
return (
<div>
<select value={this.state.value} onChange={this.props.onValue}>
{options}
</select>
</div>
);
}
}