路由器对象始终具有未定义状态

时间:2016-05-30 08:46:56

标签: aurelia aurelia-router

我在应用程序中使用Aurelia的路由机制时遇到问题。我的应用程序目前由3页组成。应用程序(主文件),欢迎和表单页面。我能够使用Auth0实现社交登录。我的想法是当有人从欢迎页面登录时,它们被重定向到表单页面。我尝试过尝试从aurelia-router导入路由器,但它始终显示未定义。我仍然掌握这个令人敬畏的框架,如果有人能告诉我哪里出错了,我将非常感激。

谢谢你们的时间。代码如下:

// app.js:
import {inject} from 'aurelia-framework';
import {Router} from 'aurelia-router';

@inject(Router)

export class App {
    constructor(router) {
        this.router = router;
        this.router.configure(config => {
            config.title = 'My App';
            config.map([
                {route: ['', 'welcome'], name: 'welcome', moduleId: 'welcome', nav: true, title: 'Welcome'},
                {route: ['form', 'form'], name: 'form', moduleId: 'form', nav: false, title: 'Provide your Details'}
            ]);
        });
        console.log(this.router) // this properly displays the object in the console
    }
}

//welcome.js:
import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-fetch-client';
import {Router} from 'aurelia-router';

@inject(HttpClient)
@inject(Router)

export class Welcome {
    heading = 'Welcome to my App!';
    lock = new Auth0Lock('xxxxxxxxxx', 'xxxxxxxxxx');
    isAuthenticated = false;

    constructor(http, router) {
        this.http = http;
        this.router = router;

        console.log(router) // Shows undefined
    }

    login() {
      // In welcome.html there is a button that succcessfully returns a successful facebook login. This function should navigate the user to the home page using:
      this.router.navigate('form');  
      // But this says navigate property is not defined
    }

}

我希望我解释得很好。谢谢你的帮助!

1 个答案:

答案 0 :(得分:1)

我弄明白了这个问题。我注意到我无法使用:

@inject(HttpClient)
@inject(Router)

我必须在一行上使用,如:

@inject(HttpClient, Router)

现在按预期工作!谢谢!