调用另一个方法的 this.method() 内部函数

Question

有没有办法在 checkBoxes() 方法的 checkbox.off().on('click', function () {}) 中调用 createElement() 方法？我无法在方法内访问函数内的方法。

class Lists {
  constructor() {
    this.currentList = [];
    this.completedList = [];
  }


  createElement(
    value1 = undefined,
    value2 = undefined,
    value3 = undefined,
    checkboxCheck = ''
  ) {
    value3.append(`<li class="list-group-item p-3">
    <input type="checkbox" ${checkboxCheck}/>
      <span  class="span-item">
        ${value1}
      </span>
      <div class="float-end">
          <i class="fas fa-edit mx-2"></i>
          <i class="fas fa-trash mx-2"></i>
      </div>
      <br />
      <span class="span-time">${value2}</span>
      </li>`);
  }

  checkBoxes() {
    const checkbox = $('input[type=checkbox]');

    checkbox.off().on('click', function () {
      this.createElement(value1, value2...)
    });
  }
}

Answer 1

有3种方法。

// set 'this' to 'self' outside the function
const self = this;
checkbox.off().on('click', function () {
  self.createElement(value1, value2...)
});

//use Function.prototype.bind to pass 'this'
checkbox.off().on('click', function () {
  this.createElement(value1, value2...)
}.bind(this));

//use arrow function
checkbox.off().on('click', () => {
  this.createElement(value1, value2...)
});

但我建议您通过搜索找出为什么 'this' 在您的代码中不起作用。

调用另一个方法的 this.method() 内部函数

Calling the this.method() inside function of another method

javascript

oop

methods

jquery

class