Question

我正在使用Ionic 2标签模板来创建应用。每当用户点击其中一个选项卡时，我想调用构造函数中编写的代码。但是，第一次点击时此刻不会发生这种情况。但是当我第二次单击时，构造函数代码被正常调用。知道为什么吗？

export class HomePage {

    data = {};

    constructor(public http: Http,
                public navCtrl: NavController,
                private authService: AuthService,
                private storage: Storage,
    ) {

        this.storage.get('email')
            .then((val) => {
            console.log(val);
                if(val === null) {
                    this.navCtrl.setRoot(LoginPage);
                }
            });
    }
    }
}

退出功能

logout() {
        this.storage.remove('email')
            .then((val) => {
                console.log('logged out successfully!');
            })
    }

离子信息：

全球套餐：

@ionic/cli-utils : 1.4.0
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.4.0

本地包裹：

@ionic/app-scripts              : 1.1.4
@ionic/cli-plugin-cordova       : 1.4.0
@ionic/cli-plugin-ionic-angular : 1.3.1
Cordova Platforms               : android 6.1.2 ios 4.1.1
Ionic Framework                 : ionic-angular 2.3.0

系统：

Node       : v7.10.0
OS         : OS X El Capitan
Xcode      : Xcode 8.2.1 Build version 8C1002 
ios-deploy : 1.9.1 
ios-sim    : 5.0.13 
npm        : 4.2.0

Answer 1

在 ngOnInit

内进行

export class HomePage  implements OnInit {
    data = {};
    constructor(public http: Http,
                public navCtrl: NavController,
                private authService: AuthService,
                private storage: Storage,
    ) {}
    ngOnInit() {
    this.storage.get('email')
            .then((val) => {
            console.log(val);
                if(val === null) {
                    this.navCtrl.setRoot(LoginPage);
                }
            });
    }
}

Answer 2

如果仅用于登录检查，请使用Ionic NavController lifecyclehook - socket.to(privateId).emit('new message', {msg: data, user: socket.username});或journalEntries。

ionViewDidEnter：

页面完全进入后运行，现在是活动页面。无论是第一次加载还是缓存页面，都会触发此事件。

ionViewCanEnter（NavGuard）：

在视图可以进入之前运行。这可以在经过身份验证的视图中用作一种“保护”，您需要在视图可以进入之前检查权限

populateJournal(){

    const j = Object.values(this.state.journal);
    var journalEntries = [];

      for (var i = 0; i < j.length; i++){
        journalEntries.push(
          <div>
          <h3>{j[i].title} - {j[i].date}</h3>
          <p>{j[i].entry}</p>
          </div>);

      }

     return(<div>{journalEntries}</div>);

}

第一次点击时没有调用构造函数 - 离子2

2 个答案: