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方法中页面之间的导航

回答

相关问题