@Ibishka

Как сделать индикатор загрузки в переходах между маршрутами?

App.vue
<template>
  <div :class="{ 'full-height': $route.name == 'Home' || openDropdown }" id="app">
    <div ref="progress" v-if="progress" class="progress"></div>
    <header class="header">
      <div class="container">
        <div class="header__row">
          <router-link to="/">
            <img src="@/assets/img/logo.svg" alt="Triangle" />
          </router-link>
          <nav class="menu hidden">
            <li class="menu__item">
              <router-link to="/" class="menu__link" active-class="active" exact>Home</router-link>
            </li>
            <li class="menu__item">
              <router-link to="/news" class="menu__link" active-class="active">News</router-link>
            </li>
            <li class="menu__item">
              <router-link to="/musics" class="menu__link" active-class="active">Musics</router-link>
            </li>
            <li class="menu__item">
              <router-link to="/media" class="menu__link" active-class="active">Media</router-link>
            </li>
          </nav>
  </div>
</template>

<script>
export default {
  data() {
    return {
      animSpectrs: true,
      openDropdown: false,
      userStopBgAudio: false,
      showScrollBtn: false,
      progress: true
    };
  }
};
</script>
  • Вопрос задан
  • 572 просмотра
Решения вопроса 1
@HikariNoSekai
Middle Front-end Developer at Visata Systems LLC
почитайте про навигационные хуки https://router.vuejs.org/ru/guide/advanced/navigat...
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы