Access React component functions from outer context - ecmascript-6

Question

I have Class1 which is only a container for Class2. I declare Test component in Class1. Now I want to pass Test into Class2 as a parameter.
Is it possible to access Test component's context being inside Class2 in place where I put a comment in?
export default class Class1 extends React.Component {
render() {
let test = (<Test />);
return (
<Class2 test={test} />
);
}
}
export default class Class2 extends React.Component {
constructor(props) {
super(props);
}
render() {
let { test } = this.props;
// how to access Test class context?
test.setValue("WHERE IS MY CONTEXT?");
return (
<div>{ test }</div>
);
}
}
export default class Test extends React.Component {
constructor(props) {
super(props);
this.state = {
value: ""
};
}
setValue(val) {
this.setState({
value: val
});
}
render() {
return (
<div>{ this.state.value }</div>
);
}
}
I tried to find something on Web and to examine the test object, but I found nothing... When I try to access test.props directly I get a React error that props are read only and can't be accessed...

Answer 1

Use props instead of state:
let { test } = this.props;
<div>{ React.cloneElement(test, {value: "Hello World"}) }</div>
And in Test:
<div>{ this.props.value }</div>
PS: Context means something else in React.

Answer 2

A complete example:
class Class1 extends React.Component {
render() {
return (
<Class2>
<Test />
</Class2>
);
}
}
class Class2 extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>
{React.cloneElement(this.props.children, {text: "WHERE IS MY CONTEXT?"})}
</div>
);
}
}
class Test extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>{ this.props.text }</div>
);
}
}
JSFiddle