导航视图 Sencha Touch 2

Question

我在Sencha Touch 2中使用NavigationView时遇到了问题。

当我点击“返回”按钮时，只能导航一个窗口。

我使用view.push()和view.pop()进行导航。

view.js:

Ext.define('MyApp.view.view', {
extend: 'Ext.navigation.View',
alias: 'widget.View',

config: {
    id: 'nvView',
    items: [
        {
            xtype: 'toolbar',
            docked: 'bottom',
            layout: {
                align: 'center',
                pack: 'center',
                type: 'hbox'
            },
            items: [
                {
                    xtype: 'button',
                    iconAlign: 'center',
                    iconCls: 'info',
                    iconMask: true,
                    text: 'Ayuda'
                },
                {
                    xtype: 'button',
                    iconAlign: 'center',
                    iconCls: 'compose',
                    iconMask: true,
                    text: 'Guardar'
                },
                {
                    xtype: 'button',
                    id: 'volver',
                    iconAlign: 'center',
                    iconCls: 'reply',
                    iconMask: true,
                    text: 'Volver'
                }
            ]
        },
        {
            xtype: 'formpanel',
            title: 'View',
            html: 'View1',
            id: 'View1',
            styleHtmlContent: true,
            items: [
                {
                    xtype: 'button',
                    docked: 'bottom',
                    id: 'bView1',
                    margin: 10,
                    ui: 'forward',
                    text: 'siguiente'
                }
            ]
        }
    ]
}
});

view2.js:

Ext.define('MyApp.view.View2', {
extend: 'Ext.form.Panel',
alias: 'widget.View2',

config: {
    fullscreen: true,
    html: 'View2',
    id: 'View2',
    styleHtmlContent: true,
    items: [
        {
            xtype: 'button',
            docked: 'bottom',
            id: 'bView2',
            margin: 10,
            ui: 'forward',
            text: 'siguiente'
        }
    ]
}
});

view3.js:

Ext.define('MyApp.view.View3', {
extend: 'Ext.form.Panel',
alias: 'widget.View3',

config: {
    fullscreen: true,
    html: 'View3',
    id: 'View3',
    styleHtmlContent: true,
    items: [
        {
            xtype: 'button',
            docked: 'bottom',
            id: 'bView3',
            margin: 10,
            ui: 'forward',
            text: 'siguiente'
        }
    ]
}
});

ViewController.js:

Ext.define('MyApp.controller.ViewController', {
extend: 'Ext.app.Controller',

config: {
    views: [
        'View'
    ],

    refs: {
        bView1: 'bView1',
        bView2: 'bView2'
    },

    control: {
        "#bView1": {
            tap: 'onView1'
        },
        "#bView2": {
            tap: 'onView2'
        }
    }
},

onView1: function(button, e, options) {
    button.up('navigationview').push({
        xtype: 'View2',
        title: 'View2'
    });
},

onView2: function(button, e, options) {
    button.up('navigationview').push({
        xtype: 'View3',
        title: 'View3'
    });
}
});

我的问题的例子是这样的：我从视图1开始，然后我按下“下一个”按钮，进入了视图2。如果我按下导航栏中的“返回”按钮，我会回到视图1，然后我再按下“下一个”按钮，进入了视图2，但是在视图2中，我按下“下一个”按钮，无法进入视图3。

非常感谢您提前的帮助！

- jmgg

---

必须提供一些代码，否则我认为没有人会尝试帮助。 - arthurakay

Answer 1

这是因为你使用了id，所以当你第二次初始化它时，会产生冲突，显示警告并且函数无法正常工作。如果你使用itemId，就会避免这个问题。

itemId: 'bView1' //same for other view bView2, bView3

为了在控制器中引用您的 itemId，例如，只需像这样操作：

refs: {
    bView1: '[itemId=bView1]',
    bhView2: '[itemId=bView2]',
    bhView3: '[itemId=bView3]'
},

control: {
     bView1: {
         tap: 'onView1'
     },
     bhView2: {
         tap: 'onView2'
     },
},

onView1: function(button, e, options) {
    button.up('navigationview').push({
        xtype: 'View2',
        title: 'View2'
    });
},

onView2: function(button, e, options) {
    button.up('navigationview').push({
        xtype: 'View3',
        title: 'View3'
    });
}

希望能对你有所帮助 :)

- Eli

---

非常感谢，你说得对。我按照你的指示解决了我的问题。:) 最后一个问题：为什么你把名称从bView2和bView3改成bhView2和bhView3？ - jmgg

哈哈！那只是因为我玩Dota太多了，打错字了：）但很高兴能帮到你:) - Eli