Question

我是sencha touch的新手。我开始使用MVC模式。我想从一个页面导航到另一个页面。在我的控制器中，我有一个轻敲功能。内部警报框在点击时有效，但它没有移动到下一个屏幕。我不知道哪里出错了。请帮忙。我的app.js看起来像这样：

//<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/Icon@2x.png',
    144: 'resources/icons/Icon~ipad@2x.png'
},

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：

Ext.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'));

}



});

Answer 1

在此功能中：

onJournalTap: function() {


    alert('i am clicked');

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

}

尝试使用此命令：console.log（a），并显示它记录的内容，我会帮助您。

PS：基本上就是Ext.NavigationView的设计目的。如果您有很多视图并且只想一次设置一个ACTIVE视图，那么让我们将它们全部包含在您的容器中，然后使用setActiveItem（该视图的索引）显示它们

在Sencha MVC方法中页面之间的导航

1 个答案: