Блог

Главная - Вопросы по программированию - VueJS — Как можно вызвать функцию при переходе страницы в App.vue

VueJS — Как можно вызвать функцию при переходе страницы в App.vue

#animation #vue.js #vue-router

#Анимация #vue.js #vue-маршрутизатор

Вопрос:

я пытаюсь создать анимацию при смене страницы перехода, мой App.Vue выглядит следующим образом :

 <transition name="test" v-on:before-leave="leave"
      v-on:leave="leave"
      v-on:after-leave="leave"
      v-on:leave-cancelled="leave"
      :duration="{ enter: 0, leave: 800 }">
        <router-view />
</transition>

Когда я нажимаю на кнопку в Home.vue, я хотел бы запустить функцию, которая находится в моем домашнем маршруте, до загрузки моей новой страницы..
Я хочу применить функцию в моем App.vue к событию beforeLeave

Спасибо,

Комментарии:

1. Это v-on:before-leave ваши пользовательские директивы?

2. vuejs.org/v2/guide/transitions.html#JavaScript-Hooks все директивы, которые я использую, описаны здесь

3. CodeSandbox может вам помочь. Если нет, дайте мне знать. Я могу создать ее для вас/

4. Да, но в вашем примере у вас нет <router-view>, и событие находится в компонентах, а не в App.vue, потому что я отображаю свой маршрут в App.vue, и я не знаю, могу ли я передать реквизиты в router view для обнаружения события leave на моей странице

5. Вот Codesandbox с router-view . дайте мне знать, если это поможет.