VueJS从另一个方法访问方法

Jac*_*pes 49 javascript methods vue.js

我正在使用VueJS制作一个简单的资源管理游戏/界面.在那一刻我想要roll每12.5秒激活一次该功能,并将结果用于另一个功能.目前虽然我一直收到以下错误:

未捕获的TypeError:无法读取未定义的属性'roll'(...)

我试过了:

  • app.methods.roll(6);
  • app.methods.roll.roll(6);
  • roll.roll()
  • roll()

但似乎无法访问该功能.任何想法我怎么可能实现这一点?

methods: {

  // Push responses to inbox.
  say: function say(responseText) {
    console.log(responseText);
    var pushText = responseText;
    this.inbox.push({ text: pushText });
  },

  // Roll for events
  roll: function roll(upper) {
    var randomNumber = Math.floor(Math.random() * 6 * upper) + 1;
    console.log(randomNumber);
    return randomNumber;
  },

  // Initiates passage of time and rolls counters every 5 time units.
  count: function count() {
    function counting() {
      app.town.date += 1;
      app.gameState.roll += 0.2;

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

    setInterval(counting, 2500);

    ...

    // Activates the roll at times.
  }
}
Run Code Online (Sandbox Code Playgroud)

Win*_*ing 99

您可以直接在VM实例上访问这些方法,也可以在指令表达式中使用它们.所有方法都将其this上下文自动绑定到Vue实例.

- Vue API指南methods

在Vue实例上的方法中,您可以使用实例访问实例上的其他方法this.

var vm = new Vue({
  ...
  methods: {
    methodA() {
      // Method A
    },
    methodB() {
      // Method B

      // Call `methodA` from inside `methodB`
      this.methodA()
    },
  },
  ...
});
Run Code Online (Sandbox Code Playgroud)

要访问Vue实例之外的方法,您可以将实例分配给变量(vm例如上面的示例中)并调用方法:

vm.methodA();
Run Code Online (Sandbox Code Playgroud)

  • 我可以使用`this`访问数据,但不能使用方法.在vuejs 2.0中有什么改变吗? (10认同)
  • @MichaelPlautz:刚刚注意到 Vue 的 [文档](https://vuejs.org/v2/api/#methods) 也提到了我在上面解释的内容:**注意你不应该使用箭头函数来定义一个方法(例如`plus: () => this.a++`)。原因是箭头函数绑定了父上下文,所以这不会是你期望的 Vue 实例,`this.a` 将是未定义的。** (5认同)
  • 我犯了错误,我做了一个ajax调用,并尝试通过`this`访问app方法,并且`var self = this; self.method()`为我工作. (4认同)
  • @SumitMurari:我明白了.另外不要忘记,如果你的项目允许,[箭头函数有词汇`this`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions#No_binding_of_this),意思是你不必做`var self = this;`. (3认同)