How to execute a child element method in React?

Question

React

Let's say there is a parent component App, inside of which there are several RandomStringand RefreshButton
When you click on RefreshButtonme from App, you need to send a command to RandomString, so that each such component executes its internal methodRandomString.refresh()

export class App extends Component<{}> {
  constructor(props: {}) {/* ... */}

  protected refreshItems() {
    // Тут надо как-то вызвать метод refresh() у дочерних RandomString
  }

  render(): ReactNode {
    return (
      <div>
        <RandomString />
        <RandomString />
        <RandomString />
        <RefreshButton onClick={this.refreshItems}  />
      </div>
    );
  }
}

Answer 1

export class App extends Component<{}> {
    this.myRef = React.createRef();
  constructor(props: {}) {/* ... */}

  protected refreshItems() {
    // Тут надо как-то вызвать метод refresh() у дочерних RandomString
  if(this.myRef&&this.myRef.current&&this.myRef.current.refresh){
      this.myRef.current. refresh()
   }
  }

  render(): ReactNode {
    return (
      <div>
        <RandomString     this.myRef = React.createRef(); />
        <RefreshButton onClick={this.refreshItems}  />
      </div>
    );
  }
}

and RandomString needs https://reactjs.org/docs/forwarding-refs.html