( React.js ) 我可以使用放置在不同组件中的函数吗？

Question

我有主组件。例如，现在我基于 1>2 渲染两个不同的组件。现在如何在另一个组件上使用来自不同组件的数据和函数

ComponentOne = React.createClass({
    render() {
        /* use theFunctionImTryingToRun  -output "a" */
    }
})



mainComponent = React.createClass({
      var x = ["a","b","c"];
   theFunctionImTryingToRun: function(){
        console.log(x[0]);

},
 mainRender: function(){
  if (1<2) {
    return (<ComponentOne /> );  
} else {
  return (<ComponentTwo />);
}

}

render() {
        return  <div> {this.mainRender()} </div>
    }
})

Answer 1

主组件

var MainComponent = React.createClass({    
  theFunctionImTryingToRun: function() {
    var x = ["a","b","c"];
    console.log(x[0]);
  },

  render: function() {
    return 1 < 2 ?
      <ComponentOne myFunction={this.theFunctionImTryingToRun} /> :
      <ComponentTwo />;
  }  
});

组件一

var ComponentOne = React.createClass({   
    render: function() {
        this.props.myFunction();
        return <h1>Hello World</h1>;
    }
});