Vuex. Почему не выполнятся action?

Question

[Андрей]

Пытаюсь по примерам реализовать JWT. При нажатии кнопки "Выйти" выполнятся метод "Logout".

methods: {
      logout: function () {
        this.$store.dispatch('logout').then(() => {
          this.$router.push('/login')
        })
      }
    },

Но в случае, если сервер вернул 401, пытаюсь так же разлогинить пользователя, получаю ошибку

TypeError: this is undefined

в месте вызова "Logout".

created() {
      this.$http.interceptors.response.use(undefined, function (error) {
        return new Promise(function () {
          if (error.response.status === 401 && error.config && !error.config.__isRetryRequest) {
            console.log('test')
            this.$store.dispatch('logout')  <-- вот тут получаю ошибку
          }
          throw error;
        });
      });
    }

Условие выполнятся потому как вижу сообщение "test". Заметил, что если this.$store.dispatch('logout') поставить сразу после created, то он выполнится. Не могу понять в чем проблема.

Answer 1

[Илья]

Потому что в промисе и выше используется function, замените на лямбду тогда контект сохранится:

created() {
      this.$http.interceptors.response.use(undefined, (error) => {
        return new Promise(() => {
          if (error.response.status === 401 && error.config && !error.config.__isRetryRequest) {
            console.log('test')
            this.$store.dispatch('logout')  <-- вот тут получаю ошибку
          }
          throw error;
        });
      });
    }

Comments

[Андрей]

Спасибо огромное