Aurelia - History

Aurelia History - 从简单和简单的步骤学习Aurelia，从基本到高级概念，包括概述，环境设置，第一个应用程序，配置，依赖注入，组件，组件生命周期，自定义元素，插件，数据绑定，绑定行为，转换器，事件，事件聚合器，表单，HTTP，参考，路由，历史，动画，对话框，本地化，工具，安全性，捆绑，调试，社区，最佳实践。

在本章中，您将学习如何使用 aurelia-history 插件.

步骤1 - 安装插件

此插件已作为标准配置的一部分提供.如果您已将 aurelia.use.standardConfiguration()设置为手动配置的一部分，那么您就可以开始使用了.

main.js

export function configure(aurelia) {   aurelia.use   .standardConfiguration()   .developmentLogging();   aurelia.start().then(() => aurelia.setRoot());}

第2步 - 使用历史记录

我们将使用上一章中的示例( Aurelia - 路线).如果我们要设置向后或向前导航的功能，我们可以使用 back()和 forward()方法使用历史对象.我们将在路由器配置后添加它.

app.js

export class App {   configureRouter(config, router) {      config.title = 'Aurelia';      config.map([         { route: ['','home'],  name: 'home',              moduleId: './pages/home/home',  nav: true, title:'Home' },         { route: 'about',  name: 'about',                moduleId: './pages/about/about',    nav: true, title:'About' }      ]);      this.router = router;   }   goBack() {      history.back();   }goForward() {      history.forward();   }}

现在，我们在视图中添加两个按钮.

app.html

用户可以通过单击我们添加的按钮来前后导航.

Aurelia历史示例