Лучший способ создать навигацию на одной странице

Question

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

Нужно ли использовать компонент маршрута?

Answer 1

Вот учебник по этой теме: https://www.tutorialspoint.com/aurelia/aurelia_routing.htm

Но вскоре, он работает так:

Шаг 1: Создание подвиды

subview.html

<template> 
    <h1>Subview</h1> 
</template> 

subview.js

export class Subview {} 

Шаг 2: Настройка Родительское представление

Добавить <router-view> в html файл родительского

app.html

<template> 
    <router-view></router-view> 
</template> 

Настройка Router в родительской ViewModel

configureRouter(config, router) { 
    config.map([ 
    { route: ['', 'home'], name: 'subview', moduleId: './subview', nav: false, title: 'Subview' }, 
    ]); 
    this._router = router; 
} 

Теперь вы можете увидеть содержимое subview «s положить в <router-view> всякий раз, когда вы находитесь на пути /#/ или /#/home.

Вы можете перемещаться между представлениями, добавляя параметр route-href="route-name" к тэгам привязки. Или путем вызова функции непосредственно из объекта this._router, например: this._router.navigateToRoute('route-name');.