FrontendDeveloper.in

Vue.js question detail

How do you access the root instance?

The root instance(new Vue()) can be accessed with the $root property.

Let's see the usage of root instance with an example.

First let's create a root instance with properties and methods as below,

// The root Vue instance
new Vue({
data: {
age: 26
},
computed: {
fullName: function () { /* ... */ }
},
methods: {
interest: function () { /* ... */ }
}
})

Now you can access root instance data and it's methods with in subcomponents as below,

// Get root data
this.$root.age

// Set root data
this.$root.age = 29

// Access root computed properties
this.$root.fullName

// Call root methods
this.$root.interest()

It is recommend using Vuex to manage state instead of using root instance as a global store.

Back to all Vue.js questions
Get LinkedIn Premium at Rs 399