【发布时间】：2016-02-24 11:26:16
【问题描述】：
我已经为此问题搜索了 100 多次，而且答案总是相同，但这对我没有帮助。所以我的问题是： 如何通过单击 sencha touch 2 中的按钮来切换视图？ 我有 2 个视图：
第一
Ext.define('Meet_Me.view.Menue', {
extend: 'Ext.Container',
alias: 'widget.Menue',
layot: 'card',
xtype: 'menue',
requires: [],
config: {
xtype: 'container',
layout: 'vbox',
centered: true,
items: [
{
xtype: 'container',
layout: 'hbox',
items: [
{
xtype: 'button',
text: 'Erstellte Events anzeigen',
width: 300,
height: 100,
margin: '30 5 5 30',
id: 'button1',
},
{
xtype: 'button',
text: 'Event erstellen',
width: 300,
height: 100,
margin: '30 5 5 30',
id: 'event_erstellen_button'
}
]
},
{
xtype: 'container',
layout: 'hbox',
items: [
{
xtype: 'button',
text: 'Event suchen',
width: 300,
height: 100,
margin: '30 5 5 30',
id: 'event_suchen_button'
},
{
xtype: 'button',
text: 'Teilnehmende Events anzeigen',
width: 300,
height: 100,
margin: '30 5 5 30',
badgeText: 'New',
id: 'teilnehmende_events_button'
}
]
},
{
xtype: 'container',
layout: 'hbox',
items: [
{
xtype: 'button',
text: 'Profil',
width: 350,
height: 100,
margin: '30 5 5 30',
//centered: true,
id: 'profil_button'
}
]
}
]
}
});
这里重要的是 id 为 'button1' 的 Button
第二种观点：
Ext.define('Meet_Me.view.Login', {
extend: 'Ext.Container',
alias: 'widget.Login',
xtype: 'login',
layot: 'card',
requires: [
'Ext.Panel',
'Ext.field.Email',
'Ext.field.Password',
'Ext.Button',
'Ext.Label'
],
config: {
items: [
{
title: 'Login',
xtype: 'panel',
itemId: 'homePanel',
layout: 'fit',
items: [
{
xtype: 'panel',
itemId: 'loginPanel',
//centered: true,
//margin: '5% 30% 0% 10%',
items: [
{
items: [
{
xtype: 'emailfield',
width: '70',
label: 'Email',
placeHolder: 'email@example.com'
},
{
xtype: 'passwordfield',
width: '70',
label: 'Passwort',
placeHolder: 'min. 6 Zeichen'
},
]
},
{
xtype: 'button',
id: 'loginButton',
margin: 20,
padding: 8,
text: 'Anmelden'
},
{
xtype: 'button',
itemId: 'registerButton',
margin: 20,
padding: 8,
text: 'Registrieren'
}
]
},
{
xtype: 'panel',
hidden: true,
itemId: 'welcomePanel',
items: [
{
xtype: 'label',
//centered: true,
html: 'Welcome!',
itemId: 'welcomeLabel'
}
]
}
]
}
]
}
});
和控制器：
Ext.define('Meet_Me.controller.Main', {
extend: 'Ext.app.Controller',
requires: [
'Meet_Me.view.Login',
'Meet_Me.view.Menue',
],
config: {
touchstarttime: 0,
control: {
'#button1': {
tap: 'btn1click'
}
}
},
btn1click: function (button, e, options) {
console.log('Button 1 was clicked');
Ext.Viewport.add({
xtype: 'Login'
});
}
});
问题是显示了登录，但带有 4 个按钮的第一个视图仍然存在。如何删除第一个视图？
【问题讨论】：
-
如果你想在你的应用中导航，你必须使用导航视图docs.sencha.com/touch/2.4/2.4.2-apidocs/#!/api/…看看文档上的例子
标签： button extjs view controller touch