Функция доступа Vuejs от вложенной функции

Question

Я пытаюсь получить доступ к функции A из функции в функции из A, например:

functionA () {
    functionB () {
        functionC () {
           #want to call functionA from here
        }
     }
 }

вот код, который я использую:

updateProgress: function (statusurl){
    axios({
      method: 'get',
      url: statusurl,
      dataType: 'json',
      headers: {'Content-Type': 'application/json; charset=utf-8'},
      async: true,
      data: {}
    })
      .then(function (response) {
        var data = response.data
        if (data['state'] !== 'PENDING' && data['state'] !== 'PROGRESS') {
          if ('result' in data) {
            // show result
            console.log('result: ' + data['result'])
          }
          else {
            // something unexpected happened
            console.log('state: ' + data['state'])
          }
        }
        else {
          // rerun in 2 seconds
          setTimeout(function() {
            this.updateProgress(statusurl)
          }, 2000)
        }
      }.bind(this))
      .catch(e => {
        console.log('error: ' + e)
      })

Как вы можетевидите, я использую this.functionA из functionC и bind () для functionA.

В консоли появляется следующая ошибка:

Uncaught TypeError: this.updateProgress is not a function at eval 

Есть идеи, как это сделать?

Answer 1

Проблема в том, что значение this изменилось.Каждый раз, когда вы вводите новую функцию (как объявлено с ключевым словом function), значение this изменяется.В данном конкретном случае виновата только функция, вызываемая setTimeout:

setTimeout(function() {
    this.updateProgress(statusurl)
}, 2000)

В прошедшие годы решением было бы получить ссылку на this под другим именем:

var me = this    

setTimeout(function() {
    me.updateProgress(statusurl)
}, 2000)

Немного меньше старой школы будет использовать bind, как и у вас для других вложенных функций:

setTimeout(function() {
    this.updateProgress(statusurl)
}.bind(this), 2000)

Если у вас есть функции со стрелками ES6 (и, судя по вашему catch может показаться, что у вас есть) тогда вам даже не нужно использовать bind.Функции стрелок не изменяют значение this, поэтому вы можете просто написать:

setTimeout(() => {
    this.updateProgress(statusurl)
}, 2000)

Аналогичным образом можно удалить другое использование bind.