如何在反应中从父级调用子组件函数 [英] How to call child component function from Parent in react

问题描述

如何在react中从Parent调用子组件函数

How to call child component function from Parent in react

点击按钮需要从parentComponent调用子函数needToBeCalled()

on click of button need to call child function needToBeCalled() from parentComponent

请参考下面的片段

class Parent {

render(){
return(
<button onClick={() => }>Click</button>
<Child />
)
}
}

class Child {
function needToBeCalled() {

}
render(){
return (

)
}
}

推荐答案

这是 React 中的反模式，但你可以使用 ref 来做类似的事情

It's antipattern in React, but you can use ref to do something like so

  class Parent {
    constructor(props) {
    super(props);
     this.myRef = React.createRef();
   }
  render(){
     return(
      <button onClick={this.myRef.current}>Click</button>
      <Child myRef={this.myRef}/>
    )
   }
  }

  class Child {
    componentDidMount(){
      function needToBeCalled() {

    }
    this.props.myRef.current = needToBeCalled
  }
  render(){
   return (

    )
 }
}

这篇关于如何在反应中从父级调用子组件函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！