Sencha MVC方法中頁面之間的導航

我是sencha touch的新手。我從MVC模式開始。我想從一個頁面導航到另一個頁面。在我的控制器中，我有一個水龍頭功能。點擊時內部的警報框工作，但不會移動到下一個屏幕。我不知道我哪裏錯了。請幫忙。我app.js看起來是這樣的：Sencha MVC方法中頁面之間的導航

//<debug> 
Ext.Loader.setPath({ 
'Ext': 'sdk/src' 
}); 
//</debug> 

Ext.application({ 
name: 'iPolis', 

requires: [ 
    'Ext.MessageBox' 
], 

views: ['Main','mainmenu','journalsearch'], 

controllers: [ 
    'mainmenu' 

], 

icon: { 
    57: 'resources/icons/Icon.png', 
    72: 'resources/icons/Icon~ipad.png', 
    114: 'resources/icons/[email protected]', 
    144: 'resources/icons/[email protected]' 
}, 

phoneStartupScreen: 'resources/loading/Homescreen.jpg', 
tabletStartupScreen: 'resources/loading/Homescreen~ipad.jpg', 

launch: function() { 
    // Destroy the #appLoadingIndicator element 
    Ext.fly('appLoadingIndicator').destroy(); 

    // Initialize the main view 
    Ext.Viewport.add(Ext.create('iPolis.view.Main')); 
    Ext.Viewport.add(Ext.create('iPolis.view.journalsearch')); 
}, 

onUpdated: function() { 
    Ext.Msg.confirm(
     "Application Update", 
     "This application has just successfully been updated to the latest version. Reload now?", 
     function() { 
      window.location.reload(); 
     } 
    ); 
} 
});

mainmenu.js：

Ext.define("iPolis.view.mainmenu", { 
extend: 'Ext.form.Panel', 
requires: ['Ext.TitleBar','Ext.form.FieldSet'], 
id:'menuPanel', 
config: { 
    fullscreen:true, 





    items: [ 
     { 
      xtype: 'toolbar', 
      docked: 'top', 
      title: 'iPolis', 
      items: [ 
       { 
        //text:'Back', 
        ui:'back', 
        icon: 'home', 
        iconCls: 'home', 
        iconMask: true, 
        handler: function() { 
         iPolis.Viewport.setActiveItem('menuPanel', {type:'slide', direction:'right'}); 
        } 
       }] 
     }, 

     { 
      xtype: 'fieldset', 
      title: 'Menu', 
      items: [ 



       { 
        xtype: 'button', 
        text: '<div class="journal">Journal</div>', 
        labelWidth: '100%', 
        name: '', 
        id:'journal', 
        handler: function() { 
         // iPolis.Viewport.setActiveItem('journalPanel', {type:'slide', direction:'left'}); 
        } 

       } 



      ] 
     } 







    ] 
} 



});

Journalsearch.js：

Ext.define("iPolis.view.journalsearch", { 
extend: 'Ext.form.Panel', 
requires: ['iPolis.view.mainmenu','Ext.TitleBar','Ext.form.Panel','Ext.form.FieldSet','Ext.Button'], 

id:'journalPanel', 

config: { 
    // tabBarPosition: 'bottom', 
    layout: { 
     // type: 'card', 
     animation: { 
      type: 'flip' 
     } 
    }, 

    items: [ 
     { 
      xtype: 'toolbar', 
      docked: 'top', 
      title: 'iPolis', 
      items: [ 
       { 
        //text:'Back', 
        ui:'back', 
        icon: 'home', 
        iconCls: 'home', 
        iconMask: true, 
        handler: function() { 

        } 
       }] 
     } 
] 
} 
});

控制器mainmenu.js：

分機。 define（'iPolis.controller.mainmenu'，{ extend：'Ext.app.Controller'，

requires: [''], 

config: { 
    control: { 


     '#journal': { 
      tap: 'onJournalTap' 
     } 


    } 
}, 

init: function() { 

}, 


onJournalTap: function() { 


    alert('i am clicked'); 

    var a = Ext.getCmp('menuPanel'); 
    a.setActiveItem(Ext.getCmp('journalPanel')); 

} 



});

來源

2012-04-03 Akshatha

在這個函數：

onJournalTap: function() { 


    alert('i am clicked'); 

    var a = Ext.getCmp('menuPanel'); 
    a.setActiveItem(Ext.getCmp('journalPanel')); 

}

嘗試使用這個命令：執行console.log（一），並顯示它的記錄，我會幫你。 PS：基本上這就是Ext.NavigationView的設計目的。如果您有很多視圖並且只想一次設置一個ACTIVE視圖，那麼讓我們將它們全部包含在容器中，然後使用setActiveItem（該視圖的索引）顯示它們。

來源

2012-04-04 04:41:32

非常感謝您的回覆。在使用這個console.log（一），我得到：Ext.apply.create.Class。 – Akshatha 2012-04-04 06:25:24

在編輯器中，它顯示一個警告：無法解析的函數setActiveItem（） – Akshatha 2012-04-04 06:28:58

看起來您還有另一個名爲** Main **的視圖，請粘貼app/view/Main.js的源代碼，或者它會更好的是你給我發送源代碼的壓縮文件，我會幫你調試它:) – 2012-04-04 06:48:40

Sencha MVC方法中頁面之間的導航

回答

相關問題