Представление маршрутизатора в представлении маршрутизатора - PullRequest
Новая
       1

Представление маршрутизатора в представлении маршрутизатора

0 голосов
/ 20 сентября 2019

У меня есть приложение с системой аутентификации и бэкэнд-приборной панелью.По умолчанию маршрут показывает компонент аутентификации: 

{
  path: "/",
  name: "Authentication",
  component: Auth
},

. В App.view содержится однажды вошедшая в систему учетная запись. Я перенаправлен на другой компонент vue "home": 

{
  path: "/dashboard",
  name: "home",
  component: Home,
},

Пока, настолько хорошо.В этом домашнем компоненте у меня есть некоторый HTML с меню, и я хочу показать компонент на той же странице.

Вот пример HTML-кода из домашнего шаблона 

<div>
  <router-link :to="'/dashboard/user'">User</router-link>
  <router-link :to="'/dashboard/stats'">Stats</router-link>

  <app-user></app-user>
  <app-stats></app-stats>
</div>

Я также создалмаршруты для этих компонентов в роутере, но при нажатии на ссылку отображается белая страница.Я только начал vue.js, и я уверен, что этим легко управлять.Моя цель - отобразить компонент в соответствии с отображаемой страницей.

1 Ответ

1 голос
/ 20 сентября 2019

Обновите файл маршрутизации, как показано ниже, чтобы родительский модуль мог загрузить свои дочерние элементы в соответствующие розетки маршрутизатора.

Поместите <router-view></router-view> в компонент панели мониторинга, чтобы он загрузил свои дочерние элементы.Если вы зайдете на /dashboard/user, то UserCompoent получит рендер в <router-view></router-view> компонента панели мониторинга. 

{
  path: "/dashboard",
  name: "home",
  component: Home,
     children: [
        {
          path: 'user',
          component: UserComponent,         
        },
         {
          path: 'state',
          component: StateComponent,         
        }       
      ],
},
...