How to declare global variable in Vue JS?
In this example, i want to share with you how to set global variable in vue js. so you can get global variable value and use global variable in vue js. if you define global variable then you can easily access global variable in vuejs app.
We will define global variables using vue js mixin. using mixin we will declare all variables in data method. then we will use in our app vue object.
Here, we will create simple example of declaring vue js global variable. i will create "myGlobalVar" variable with some dummy text on vue js mixin. then we will use "myGlobalVar" variable in our vue js app main object and their method.
So you can see bellow full example:
Example:
<!DOCTYPE html>
<html>
<head>
<title>How to declare global variable in Vue JS? - ItSolutionStuff.com</title>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
<div id="app">
<p>Result : {{myResult}}</p>
<button @click="clickFunction()">Click Me</button>
</div>
<script type="text/javascript">
Vue.mixin({
data: function() {
return {
myGlobalVar:'this is my ItSolutionStuff.com'
}
}
})
var app = new Vue({
el: '#app',
data: {
myResult: ''
},
methods:{
clickFunction: function () {
this.myResult = this.myGlobalVar;
}
}
})
</script>
</body>
</html>
Output:
Result : this is my ItSolutionStuff.com
I hope it can help you...

Hardik Savani
I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- Vue JS - Get Query String Parameters Example
- How to Download File using Axios Vue JS?
- Vue JS Get Dropdown Selected Value Example
- How to get string length in Vue JS?
- Vue JS Convert String to Array | Vue JS Split String Example
- Vue JS Get Array Length Or Object Length Example
- Vue JS call a function on load Example
- How to get current date time in vue js?