Sometimes, we want to include global functions in Vue.js.
In this article, we’ll look at how to include global functions in Vue.js.
How to include global functions in Vue.js?
To include global functions in Vue.js, we can create our own plugin.
For instance, we write
MyPlugin.install = (Vue, options) => {
Vue.myGlobalMethod = () => {
//...
};
Vue.directive("my-directive", {});
Vue.prototype.$myMethod = function () {
//...
};
};
to create the MyPlugin plugin.
We set its install method to a function that adds a global static method with
Vue.myGlobalMethod = () => {
//...
};
We add a directive with
Vue.directive("my-directive", {});
And we add an instance method with
Vue.prototype.$myMethod = function () {
//...
};
Then we register the plugin with Vue.use by writing
Vue.use(MyPlugin)
We can call global static methods with
Vue.myGlobalMethod(parameters);
And we call component instance methods with
this.$myMethod
in a component.
Conclusion
To include global functions in Vue.js, we can create our own plugin.
