0

認証フォームとタブパネルの 2 つの項目を持つビューポートがあります。このビューポートの initComponent メソッドで、ユーザーがログイン名とパスワードを入力したかどうかをチェックする関数を呼び出します。

そうでない場合は、認証フォームが表示され、ログイン ボタンをクリックするとタブ パネルが表示されます。

しかし、資格情報が保存されている場合は、アプリが自動的にタブ パネルに切り替わるようにします。

これが私がやりたかった方法です：

app.views.Viewport = function (config) {
    Ext.apply(this, config);

    this.user = null; // Setter par le checkLogin !

    this.bottomTabs = new Ext.TabPanel({
        tabBar: { 
            dock: 'bottom',
            layout: { pack: 'center' } 
        }, 
        items:[...],                             
        layout: 'fit',
        cardSwitchAnimation: false,
    });

    this.userLogin = new app.views.UserLogin();

    //constructor
    app.views.Viewport.superclass.constructor.call(this, {
        fullscreen: true,
        layout: 'card',
        cardSwitchAnimation: 'fade',
        items: [
            this.userLogin,
            this.bottomTabs
        ]
    });

};

Ext.extend(app.views.Viewport, Ext.Panel, {
    initComponent: function () {
        app.views.Viewport.superclass.initComponent.call(this);
        this.initialCheck();
    },

    initialCheck: function(){
        console.log('init');
        var credentials = window.localStorage.getItem("neroApp_credentials");
        if (credentials == null || credentials == "reset") {
            console.log('no creds');
            this.setActiveItem(this.userLogin); // ***
        }
        else {
            console.log('creds');
            Ext.Ajax.defaultHeaders = {'Authorization':"Basic " + credentials};
            this.checkLogin();
        }
    },

    checkLogin: function () {
        console.log('checkLogin');
        Ext.Ajax.request({
            url: app.stores.baseAjaxURL + '&jspPage=%2Fajax%2FgetUser.jsp',
            scope: this,
            success: function(response, opts) {
                console.log('success');
                var user = Ext.decode(response.responseText);
                this.user = user;
                this.actualites.actualitesList.refreshActu(this.user, parseInt(window.localStorage.getItem("newsPerLoad")));
                this.setActiveItem(this.bottomTabs, { type: 'fade', duration: 500 });
            },
            failure: function(response, opts) {
                console.log('failure');
            }
        });
    },

    resetLogin: function() {
        window.localStorage.setItem("neroApp_credentials", "reset");
        Ext.Ajax.defaultHeaders = {'Authorization':"Basic RESET_Credentials"};
    }

});

しかし、 *行が原因で、起動時に白い画面が表示されます。おそらく、checkLogin 関数の setActiveItem が正常に機能するため、起動が早すぎると思います。

この setActiveItem がエラーを発生させる理由を知っている人はいますか?

ありがとう

4

1 に答える 1

0

わかりました、initComponent 内で setActiveItem を起動することは良い習慣ではないと推測していますが、問題が何であるかはわかりませんでしたが、次のようにアクティブなアイテムを設定することで最終的に機能するようになりました。

    initialCheck: function(){
        console.log('init');
        var credentials = window.localStorage.getItem("neroApp_credentials");
        if (credentials == null || credentials == "reset") {
            this.activeItem = this.userLogin;
        }
        else {
            this.activeItem = this.bottomTabs;
            Ext.Ajax.defaultHeaders = {'Authorization':"Basic " + credentials};
            this.checkLogin();
        }
    },
于 2012-02-17T19:54:21.823 に答える