Vue.js一个方法调用另一个方法

最初发表于: 2020-02-10 17:03:16

在同一个组件内, 一个方法调用methods中的另外一个方法, 格式如下

this.$options.methods.fun2();

当然, 这是在fun1()中直接调用fun2()的方法, 但是, 比如你要在fun1()中的函数中调用fun2(), 这没写就不行了, 因为那时this可能已不是Vue对象, 所以, 以下代码会报错

methods: {
   fun1: function() {
      console.log('I am fun1()')
      setInterval(function(){
          this.$options.methods.fun2()//这里报错因为此时this不是Vue对象了
      })
   },
   fun2: function() {
      console.log('I am fun2()')
   }
}

正确应该这么写

methods: {
   fun1: function() {
      let _self = this//用_self记录this
      console.log('I am fun1()')
      setInterval(function(){
          _self.$options.methods.fun2()//这里这么写
      })
   },
   fun2: function() {
      console.log('I am fun2()')
   }
}

但是这样调用时, 变量的值可能会出错, 因此不建议Vue一个方法调用另一个方法