Vuejs: Методы рефакторинга

Question

у меня есть подсказка:

Как вы порекомендуете мне провести рефакторинг метода?

У меня есть метод, который я использую в некоторых файлах и много раз в одном файле:

async getValidToken() {
  let jwt = await this.$store.dispatch('auth/getValidToken').then((response) => {
    if (response.jwt) {
      return response.jwt
    }
    this.$store.commit('ALERT', {
      color: 'error',
      text: response.msg + ', Please Login',
    })
    this.$store.dispatch('auth/logout')
    this.$router.push('/pages/login')
    return null
  })
  return jwt
},

Важно отметить, что я создаю файл хранилища для каждого случая:

и импортирую их в индекс. js файл

import Vue from 'vue'
import Vuex from 'vuex'
import * as user from './modules/user.js'
import * as auth from './modules/auth.js'
import * as group from './modules/group'
import * as system from './modules/system'
import * as module from './modules/module'

Заранее ценю ваш совет

Answer 1

Экспортируйте эту функцию в любой файл, убедитесь, что она получает экземпляр vue (так как у него не будет свойства "this"), и просто импортируйте его куда угодно ...

export const getValidToken = async (vm) => {
  let jwt = await vm.$store.dispatch('auth/getValidToken').then((response) => {
    if (response.jwt) {
      return response.jwt
    }
    vm.$store.commit('ALERT', {
      color: 'error',
      text: response.msg + ', Please Login',
    })
    vm.$store.dispatch('auth/logout')
    vm.$router.push('/pages/login')
    return null
  })
  return jwt
};