Return to Answer

If you really don't want to use a prop, you can use a store.js file or vuex as a state management tool and use a computed property instead.

Commit a mutation from the parent component (or from anywhere in your app for that matter) and the child component will react to the change of the computed property.

store.js

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { loading: false }, mutations: { isLoading (state) { state.loading = !state.loading } } }) 

anywhere in your app :

this.$store.commit('isLoading') 

in your component :

computed: { loading () { return this.$store.state.loading } 

If you really don't want to use a prop, you can use a store.js file or vuex as a state management tool and use a computed property instead.

Commit a mutation from the parent component (or from anywhere in your app for that matter) and the child component will react to the change of the computed property.

store.js

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { loading: false }, mutations: { isLoading (state) { state.loading = !state.loading } } }) 

anywhere in your app :

this.$store.commit('isLoading') 

in your component :

computed: { loading () { return this.$store.state.loading } 

Edit : another way to avoid using prop, you could write a method in your child component to update the loading variable and call the method from the parent component. However I can't see any benefit of using this over a prop.

If you really don't want to use a prop, you can use a store.js file or vuex as a state management tool and use a computed property instead.

Commit a mutation from the parent component (or from anywhere in your app for that matter) and the child component will react to the change of the computed property.

store.js

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { loading: 0 }, mutations: { isLoading (state) { state.loading = !state.loading } } }) 

anywhere in your app :

this.$store.commit('isLoading') 

in your component :

computed: { loading () { return this.$store.state.loading } 

If you really don't want to use a prop, you can use a store.js file or vuex as a state management tool and use a computed property instead.

Commit a mutation from the parent component (or from anywhere in your app for that matter) and the child component will react to the change of the computed property.

store.js

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { loading: false }, mutations: { isLoading (state) { state.loading = !state.loading } } }) 

anywhere in your app :

this.$store.commit('isLoading') 

in your component :

computed: { loading () { return this.$store.state.loading } 

If you really don't want to use a prop, you can use a store.js file or vuex as a state management tool and use a computed property instead.

Commit a mutation from the parent component (or from anywhere in your app for that matter) and the child component will react to the change of the computed property.

If you really don't want to use a prop, you can use a store.js file or vuex as a state management tool and use a computed property instead.

Commit a mutation from the parent component (or from anywhere in your app for that matter) and the child component will react to the change of the computed property.

store.js

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { loading: 0 }, mutations: { isLoading (state) { state.loading = !state.loading } } }) 

anywhere in your app :

this.$store.commit('isLoading') 

in your component :

computed: { loading () { return this.$store.state.loading }