Question

在react native中定义父组件中的函数并在子组件中调用子组件如何在react native中实现此功能

在此先感谢:)

Answer 1

一个人可以使用callback function reference实现这一目标。

GrandParent

class GrandParent extends Component {

                Fun=()=>{
                    console.log(1);
                }

                render(){
                    //passed the ref for GrandFunRef in Parent component
                    return (<Parent GrandFunRef={this.Fun} >)
                }
}

父母

    class Parent extends Component {

                parentFun=()=>{
                    console.log(1);
                }

                render(){
                    //passed the ref for GrandFunRef in Child component
                    return (<Child GrandFunRef={this.props.GrandFunRef} >)
                }
}

孩子

class Child extends Component {

        componentDidMount(){

            this.props.GrandFunRef(); // call the Parent parentFun
        }

    }

Answer 2

如果您有一棵大树，那么就不用“道具钻”了，这真是太烦人了。您可以使用Context API。

Answer 3

这是您要找的吗？

function Parent() {
    // do something meaningful
    return <Child onClick={() => console.log('Handling any click referencing me')}/>
}

function Child({onClick}) {
    // do something meaningful
    return <button onClick={onClick}/>
}

从子组件触发函数并在React Native中在父组件中定义

3 个答案: