javascript - VueJS 错误 "Uncaught TypeError: this.sendDrag is not a function"in mounted ()

Question

我不明白为什么 this.sendDrag('started') 返回这个错误:

"Uncaught TypeError: this.sendDrag is not a function"

  methods: {
    sendDrag (val) {
      console.log(val)
    }
[...]



    mounted () {
        this.$nextTick(() => {
          this.$refs.flickity.on('dragStart', function () {
            this.stageDragging = true
            this.sendDrag('started')
          })

导致错误的原因以及如何解决？

Answer 1

您需要在闭包中捕获 this 的值，因为您正在从具有不同 this 的函数中调用它。

如果您使用箭头 lambda 表示法 ()=>{} 而不是 function() 它会自动为您捕获 this .这就是两种表示法之间的真正区别。

mounted () {
        this.$nextTick(() => {
          const that = this;
          this.$refs.flickity.on('dragStart', function () {
            that.stageDragging = true
            that.sendDrag('started')
          })