Где настроить API в Vue.js - PullRequest
Новая
       17

Где настроить API в Vue.js

0 голосов
/ 28 августа 2018

Мне нужно использовать API, который требует инициализации с помощью ключа API, и некоторые другие детали в моем приложении Vue.js. 

var client = api_name('app_id', 'api_key', ...)

Мне нужно сделать несколько вызовов API с объектом client в нескольких компонентах моего приложения 

client.api_function(...)

Как мне избежать повторения этапа инициализации в каждом компоненте?

Я думаю об использовании глобального mixin в main.js для этого 

  Vue.mixin({
      data: function() {
         return {
           get client() {
            return api_name('app_id', 'api_key');
           }
        }
     }
  })

Это хороший подход?

Ответы [ 2 ]

0 голосов
/ 29 августа 2018

Я бы лучше переместил ваш геттер в сервис и просто импортировал туда, где он вам действительно нужен. Кажется, он не вписывается в раздел data, а скорее как methods. Миксин - это достойный подход, если вам нужно много подобных вещей: переменные, методы, хуки и т. Д. Создание миксина только для одного метода выглядит для меня излишним. 

// helper.js
export function getClient () {
  // do stuff
}

// MyComponent.vue
  import { getClient } from 'helpers/helper`
  // Vue instance 
  methods: { 
    getClient 
  }
0 голосов
/ 29 августа 2018

Как насчет создания вспомогательного файла и написания плагина, который предоставляет доступ к вашим URL-адресам? Затем вы можете создавать прототипы на экземпляре vue. Вот пример, 

const helper = install(Vue){
 const VueInstance = vue
 VueInstance.prototype.$login = `${baseURL}/login`
}
export default helper

Таким образом, вы можете получить глобальный доступ к URL, используя this. $ Login . Обратите внимание, что $ - это соглашение, позволяющее избежать конфликтов имен и легко запомнить, что это плагин.

...