将路由器配置放在Aurelia中的一个单独文件中

Put router configuration in a separate file in Aurelia

本文关键字:一个 文件 单独 配置 路由器 Aurelia      更新时间:2023-09-26

我正试图从app.js文件中取出路由器配置,并将其放在一个单独的文件(app.router.js)中。这可能是一件容易的事情,但我不知道怎么做。

当前app.js文件如下所示:

import {Router} from 'aurelia-router';
export class App {
  static inject() { return [Router]; };
  constructor(router) {
    this.router = router;
    // router - put this part in a separate file
    this.router.configure(config => {
      config.title = 'demo';
      config.options.pushState = true;
      config.map([
        // home routes
        { route: ['','home'], moduleId: './home/home', nav: true, title:'Home' },
        // User routes
        { route: ['user/register'], moduleId: './user/register', nav: true, title:'User Registration'}
      ]);
    });
  }
}

一旦配置部分在一个单独的文件中,我相信我已经在app.js:中这样称呼它了

this.router.configure(myRouterConfig);

请让我知道如何使用代码示例。

当您意识到传递给this.router.configure的参数只是一个函数时,解决方案更容易理解。要将路由器配置放在一个单独的文件中,只需让该文件导出一个带有一个参数(config)的函数。

// app.router.js
export default function (config) {
  config.title = 'demo';
  config.options.pushState = true;
  config.map([
    // home routes
    { route: ['','home'], moduleId: './home/home', nav: true, title:'Home' },
    // User routes
    { route: ['user/register'], moduleId: './user/register', nav: true, title:'User Registration'}
  ]);      
}

然后,在app.js:中

import appRouter from 'app.router';
// ...then...
this.router.configure(appRouter);

当然,您可以随意命名appRouter