从另一个方法中调用 VueJS 方法：实用指南

2024-03-02 09:45:12

从另一个方法中调用 VueJS 方法：综合指南

简介

在 VueJS 中，从另一个方法中调用方法是一种常见的需求。可以通过多种方式来实现，但最常见的方法是使用 this 。

使用 `this` 关键字

this 关键字指向当前组件实例，可以用于访问组件中的数据和方法。要从另一个方法中调用方法，可以使用以下语法：

this.methodName()

例如，以下代码从 count 方法中调用 roll 方法：

count: function count() {
  function counting() {
    app.town.date += 1;
    app.gameState.roll += 0.2;

    if (app.gameState.roll === 1) {
      var result = this.roll(6);
      app.gameState.roll === 0;
      return result;
    }
  }

  setInterval(counting, 2500);
}

其他方法

除了使用 this 关键字，还有一些其他方法可以从另一个方法中调用方法：

箭头函数： 箭头函数可以绑定当前组件实例，因此可以省略 this 关键字。

count: function count() {
  function counting() {
    app.town.date += 1;
    app.gameState.roll += 0.2;

    if (app.gameState.roll === 1) {
      var result = () => {
        this.roll(6);
        app.gameState.roll === 0;
        return result;
      }
    }
  }

  setInterval(counting, 2500);
}

bind 方法： bind 方法可以将一个函数绑定到特定的上下文。

count: function count() {
  function counting() {
    app.town.date += 1;
    app.gameState.roll += 0.2;

    if (app.gameState.roll === 1) {
      var result = this.roll.bind(this)(6);
      app.gameState.roll === 0;
      return result;
    }
  }

  setInterval(counting, 2500);
}