Call function in child component from parent in React

Call function in child component from parent in React

Parent component

import React, { Component, createRef } from 'react'
import Child from './Child'

class Parent extends Component {
  constructor (props) {
    super(props)
    this.childRef = createRef()
  }

  clickTrigger = () => {
    if (this.childRef) {
      this.childRef.current.functionToCall()
    }
  }

  render () {
    return (
      <div>
        <button onClick={this.clickTrigger} />
        <Child ref={this.childRef} />
      </div>
    )
  }
}

Child component

import React, { Component } from 'react'

class Child extends Component {
  state = {
    isClicked: 'No click'
  }

  functionToCall = () => {
    this.setState({ isClicked: 'Clicked' })
  }

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