How to get refs from another component in React JS

Question

The code in main App component is as follows :

class App extends Component {
  componentDidMount(){
      console.log(this.ref);
      debugger;
  }

  render()         


        

Answer 1

ref is property of each this.props.children hence you can access ref of child component in parent via ref property on this.props.children

Make sure you access ref after componentDidMount

Edit :

Try below set of code if this works :

var myChild= React.Children.only(this.props.children);
var clone = React.cloneElement(myChild, { ref: "myRef" });