У меня есть следующий код в моем файле main.js
:
import Vue from 'vue';
import App from './components/App';
import router from './router';
const app = new Vue({
data: { loading: false },
router,
render: h => h(App),
}).$mount('#app');
Теперь я пытаюсь установить переменную загрузки с моего маршрутизатора (./router/index.js
):
router.beforeEach((to, from, next) => {
this.$root.loading = true;
next();
})
router.afterEach((to, from) => {
this.$root.loading = false;
next();
})
но это не работает. я всегда получаю
Cannot read property '$root' of undefined
Любые идеи, что я делаю неправильно?
Вы должны использовать this
в следующем обратном вызове, потому что защита вызывается до подтверждения навигации, поэтому новый входной компонент еще даже не создан.
router.beforeEach((to, from, next) => {
//vm refers to this
next((vm)=>{vm.$root.loading = true;});
})
router.afterEach((to, from, next) => {
next((vm)=>{vm.$root.loading = false;});
})
Да, вы правы, у aftereach нет следующего обратного вызова router.vuejs.org/api/#router-aftereach
Но как установить $root.loading
на false
, когда я не могу вызвать next
?
Хорошо, я слишком рано обрадовался ;-)
router.afterEach
не имеет следующей функции