Вызов метода, переданного как опора в реакции - PullRequest
4 голосов
/ 07 августа 2020

У меня есть метод в родительском элементе, ди передал его как опору; вот так:

<NavBar retrieveList={this.retrieveList}/>

и в моем дочернем компоненте я не могу вызвать этот метод из тела другого метода.

handleCloseModal () {
    window.$('#newHireModal').modal('hide');   /* this is working */
    console.log(this.props.retrieveList);     /* it gives method body, just to be sure props is coming here */
    this.props.retrieveList;   /*it gives "Expected an assignment or function call..." */
    this.props.retrieveList();   /*it gives "this.props.retrieveList is not a function" */
    return this.props.retrieveList;   /*it does nothing. no working, no error. */
  }

Кстати, у меня есть конструктор и привязка;

constructor(props) {
    super(props);
    this.handleCloseModal = this.handleCloseModal.bind(this);
retrieveList() {
    StaffDataService.getAll()
      .then(response => {
        this.setState({
          staffWithBasics: response.data,
          filteredItems: response.data,
        });
      })
      .catch(e => {
        console.log(e);
      });
  }

в чем моя проблема с этим кодом, как я могу запустить этот родительский метод?

1 Ответ

2 голосов
/ 07 августа 2020

Это происходит потому, что this в компоненте, который получает делегат, отличается от this, используемого в функции. Вам нужно будет связать его при передаче.

<NavBar retrieveList={this.retrieveList.bind(this)}/>

И затем вы можете вызвать его в теле функции следующим образом.

this.props.retrieveList();
...