Почему это не определено в функции при вызове .bind (this)?

Question

Почему это не определено в функции при вызове .bind (this)?

В моем компоненте я вызываю функцию, определенную в другом файле следующим образом:

import React from 'react';
import { widgetComponentDidMount } from "../../SharedData/widget";

export default class Component extends React.Component {

    constructor(props) {
        super(props);
    };

    componentDidMount(){
        widgetComponentDidMount(this).bind(this);
    }

    //render, etc

};

Но когда я помещаю отладчик в определение функции, «это» не определено:

export function widgetComponentDidMount() {
    var _this = this;
    debugger
    //_this is undefined
}

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

javascript,reactjs,

0

Ответов: 1

JavaScript, reactjs,

Похожие вопросы

score 3 · Accepted Answer

3 принят

Вы выполняете функцию перед вызовом . Перед выполнением необходимо связать:widgetComponentDidMount.bind(this)();

bind

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

export default class Component extends React.Component {

  constructor(props) {
    super(props);
    this.widgetComponentDidMount = widgetComponentDidMount.bind(this);
  }

  componentDidMount() {
    this.widgetComponentDidMount();
  }
}