run child function from parent react

YOU.com answered on December 4, 2022 Popularity 9/10 Helpfulness 4/10

answer run child function from parent react

related call child component method from parent react

run child function from parent react

Comment

import React, { useRef } from 'react';
import ChildComponent from './ChildComponent';

const ParentComponent = () => {
  const childRef = useRef(null);

  const runChildFunction = () => {
    if (childRef.current) {
      childRef.current.childFunction();
    } else {
      console.error("Child ref is not set.");
    }
  };

  return (
    <div>
      <button onClick={runChildFunction}>Run Child Function</button>
      <ChildComponent ref={childRef} />
    </div>
  );
};

export default ParentComponent;

Popularity 9/10 Helpfulness 4/10 Language javascript

Source: Grepper

Link to this answer
Share Copy Link

Contributed on Sep 12 2023

YOU.com

0 Answers Avg Quality 2/10

Closely Related Answers

call child component method from parent react

Comment

const { Component } = React;

class Parent extends Component {
  constructor(props) {
    super(props);
    this.child = React.createRef();
  }

  onClick = () => {
    this.child.current.getAlert();
  };

  render() {
    return (
      <div>
        <Child ref={this.child} />
        <button onClick={this.onClick}>Click</button>
      </div>
    );
  }
}

class Child extends Component {
  getAlert() {
    alert('getAlert from Child');
  }

  render() {
    return <h1>Hello</h1>;
  }
}

ReactDOM.render(<Parent />, document.getElementById('root'));

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: stackoverflow.com

Tags: call

Link to this answer
Share Copy Link

Contributed on Dec 04 2022

David Phurtseladze

0 Answers Avg Quality 2/10

run child function from parent react

Contents

More Related Answers

run child function from parent react

Closely Related Answers

call child component method from parent react

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.