react calling a function in a child component
The easiest way to achieve this is through using refs
(See documentation).
var Parent = React.createClass ({
triggerChildDisplay: function() {
this.refs.child.display();
},
render() {
<Button onClick={this.triggerChildDisplay} />
}
})
var Child = React.createClass ({
getInitialState () {
return {
display: true
};
},
display: function(){
this.setState({
display: !this.state.display
})
},
render() {
{this.state.display}
}
})
I basically copied in your example, but do note that in your Parent, I don't see you render a Child component, but typically, you would, and on that Child you would give it a ref, like <Child ref="child" />
.