Question

当用户首次启动我的Aurelia网络应用时，我需要检查localStorage以查看我的应用是否需要恢复其上一个状态。如果是，则需要从localStorage设置内部模型值并恢复路由。如果没有，它只需要设置到初始路线的路线（称为“游戏”）。所以我想我可以在app.js中设置我的路由器配置，如下所示：

config.map([
    { route: '', name: 'launcher', moduleId: 'launcher'},
    { route: 'game', name: 'game', moduleId: 'game-view'},
    ......

启动器模块将执行此初始化。

launcher.js（部分伪代码）：

import {
    inject,
    noView
} from "aurelia-framework";
import {
    Router
} from 'aurelia-router';

@noView
@inject(Router)
export class Launcher {
    constructor(router) {
        Get localStorage values, including lastState;

        if (need to restore the past state) {
            router.navigateToRoute(lastState);
        } else {
            router.navigateToRoute('game');
        }
    }
}

问题是，我真的不需要这个模块的视图，但如果我没有launcher.html文件，Aurelia会抛出错误（即使一切正常）。我认为noView装饰器可以解决这个问题，但事实并非如此。

有没有办法让没有视图的导航模块？有更好的方法吗？

Answer 1

如果您不想要视图，也可以使用@noView属性。

基本用法：

<a-entity meshline="lineWidth: 20; path: 37.32299  -122.04185 0, 37.32298  -122.03224</a-entity>

Answer 2

你可以将Launcher注入你的app.js：

import {inject} from 'aurelia-framework';
import {launcher} from '[file path to launcher]';

@inject(launcher)
export class App{
    constructor(launcher)
    {
        this.launcher = launcher;
        this.launcher.activate();
    }
}

然后在你的启动器激活方法中，有你的逻辑：

import {inject} from "aurelia-framework";
import {Router} from 'aurelia-router';

@inject(Router)
export class Launcher {
    constructor(router) { 
        this.router = router;
    }

    activate(){
         Get localStorage values, including lastState;

         if (need to restore the past state) {
             this.router.navigateToRoute(lastState);
         } 
         else {
             this.router.navigateToRoute('game');
         }
    }        
}

如果这不起作用，那么另一个选择是设置根然后导航到某个状态，即

import {inject, Aurelia} from 'aurelia-framework';

@inject(Aurelia)
export class Launcher{
    constructor(Aurelia){
        this.aurelia = Aurelia;
    }

    activate(){
        Get localStorage values, including lastState;

        if (need to restore the past state) {
         this.aurelia.setRoot([file path of starting page])
             .then((aurelia) => {   aurelia.root.viewModel.router.navigateToRoute('lastState');}); 
     } 
     else {
         this.aurelia.setRoot([file path of starting page])
             .then((aurelia) => {  aurelia.root.viewModel.router.navigateToRoute('game');}); 
          }
     }

}

只需确保您的起始页面（具有路由器地图）不是app.js，因为这样您就会有循环依赖。您可以将另一个文件作为起始页面。

Answer 3

constructor(router) {
    this._router = router;
}

activate(){
    //Get localStorage values, including lastState;
    if (need to restore the past state) {
        this._router.navigateToRoute(lastState);
    } else {
        this._router.navigateToRoute('game');
    }
}

Aurelia视图模型没有视图？

3 个答案: