Используйте родительскую функцию внутри дочерней функции - PullRequest
Новая
       6

Используйте родительскую функцию внутри дочерней функции

0 голосов
/ 22 февраля 2019

Я пытаюсь вызвать родительскую функцию с аргументами от дочернего компонента, но я точно не знаю, как заставить это работать.Мне, в частности, нужно иметь возможность вызывать родительскую функцию из дочерней функции в другой функции, поэтому я попытался передать ссылку на функцию через реквизиты, но это не совсем правильно.Родительскому классу принадлежит ресурс, с которым только он должен взаимодействовать через конкретный вызов функции, который я передаю.Когда это делается следующим образом, мне говорят, что функция не определена. 

export class ParentClass extends React.Component {

    ParentFunctionWithArguments(a, b) {
        alert("a is being used by my private resource");
        alert("b is being used by my private resource");
        return true; //some result based on a and b
    }

    render() {
        return (
            <ChildClass>ParentFunctionWithArguments={() => this.ParentFunctionWithArguments()}</ChildClass>
        );
    }
}

И 

export class ChildClass extends React.Component {
    ...
    handleOk = (e) => {
        ...
        if (condition) {
            if (this.props.ParentFunctionWithArguments(a, b)) {}
        }
        ...
    };
    ...
}

Ответы [ 3 ]

0 голосов
/ 22 февраля 2019

Вам просто нужно указать родительскую функцию как подпорку для дочернего компонента, а не вызывать ее в дочерних элементах 

export class ParentClass extends React.Component {

    ParentFunctionWithArguments(a, b) {
        alert("a is being used by my private resource");
        alert("b is being used by my private resource");
        return true; //some result based on a and b
    }

    render() {
        return (
            <ChildClass ParentFunctionWithArguments={this.ParentFunctionWithArguments}></ChildClass>
        );
    }
}

и просто вызывать ее в дочернем режиме, как 

export class ChildClass extends React.Component {

    handleOk = (e) => {
        ...
        if (condition) {
            if (this.props.ParentFunctionWithArguments(a, b)) {}
        }
        ...
    };

    ...
}
0 голосов
/ 28 марта 2019

То, что я искал, было функцией "bind"

что-то вроде этого в конструкторе родителя: 

export class ParentClass extends React.component {
    constructor() {
        this.ParentFunctionWithArguments = this.ParentFunctionWithArguments.bind(this);
    }
    ... //rest unchanged
}

Это позволит дочернему элементу использовать переданный в parentфункция в ванильной реакции.

0 голосов
/ 22 февраля 2019 
<childComponent callFromChild={this.parentMethod}/>


//in child component call like below
this.props.callFromChild()
...