Включить глобальные функции в Vue.js

В моем приложении Vue.js я хочу иметь некоторые глобальные функции. Например, callApi() которую я могу вызывать каждый раз, когда мне нужен доступ к моим данным.

Каков наилучший способ включить эти функции, чтобы я мог получить доступ к ним во всех моих компонентах?

  • Должен ли я создать файл functions.js и включить его в мой main.js?
  • Должен ли я создать Mixin и включить его в мой main.js?
  • Есть ли лучший вариант?

Ответ 1

Лучшим вариантом будет плагин, который позволяет добавлять функции в глобальную систему vue.

[из Vuejs Docs]

MyPlugin.install = function (Vue, options) {

// 1. add global method or property
Vue.myGlobalMethod = ...

// 2. add a global asset
Vue.directive('my-directive', {})

// 3. add an instance method
Vue.prototype.$myMethod = ...

}

Тогда вы просто добавили бы

Vue.use(MyPlugin)

в вашем коде перед вызовом вашей функции.

Vue.myGlobalMethod(parameters);

или в вашем случае

Vue.callApi(parameters);