単一のページでナビゲーションを作成する最良の方法

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：親ビューを設定し

親のhtmlファイル

app.html

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

設定に<router-view>を追加親ののviewmodel

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

であなたがルート/#/または/#/home上にある時はいつでも今あなたが<router-view>に入れsubviewの内容を見ることができます。

アンカータグにroute-href="route-name"パラメータを追加すると、ビュー間を移動できます。または、this._routerオブジェクトから関数を直接呼び出します（例：this._router.navigateToRoute('route-name');）。