몇 가지보기가있는 테스트 응용 프로그램이 있습니다. 내 버튼에 간단한 '탭'수신기를 호출하려고합니다. 컨트롤러가 인스턴스화되어 실행 되더라도 탭 이벤트는 시작되지 않습니다. 컨트롤러Sencha Tap Listener가 실행되지 않습니다.
Ext.define('MyApp.controller.Main', {
extend: 'Ext.app.Controller',
requires: [
'MyApp.view.Main'
],
init: function(){
// download and parse data from server here.
console.log('controller initiated!');
},
config: {
refs: {
loginBtn: 'button[action=login]'
},
control: {
loginBtn: {
tap: 'loginBtnHandler'
}
}
},
loginBtnHandler: function(){
this.callParent(arguments);
Ext.Msg.alert('here');
}
});
Main.js - -
은 여기 내 app.js
Ext.application({
name: 'MyApp',
requires: [
'Ext.MessageBox',
'Ext.form.FormPanel',
'Ext.navigation.View'
],
views: [
'Main',
'Tasks'
],
controllers: [
'Main'
],
models: [
'Task',
'Schedule'
],
stores: [
'Tasks',
'Schedules'
],
launch: function() {
// Destroy the #appLoadingIndicator element
try{
Ext.fly('appLoadingIndicator').destroy();
}catch(err){
console.warn("[CUSTOMWARN]Could not destroy loading indicator because of -- \n"+err);
}
var DEBUG=false;
if(!DEBUG){
// Initialize the main view
Ext.Viewport.add(Ext.create('MyApp.view.Main'));
}
}
});
Main.js의보기
Ext.define('MyApp.view.Main', {
extend: 'Ext.navigation.View',
alias: 'customnavigationview',
requires: [
'MyApp.form.Login'
],
config: {
navigationBar: {
hidden: true
},
items: [
{
xtype: 'logincard',
flex: 1
}
],
}
});
Login.js - 위해 xtype을 위해 : 'logincard'
Ext.define('MyApp.form.Login', {
extend: 'Ext.form.Panel',
xtype: 'logincard',
requires: [
'Ext.field.Password',
'Ext.field.Email',
'Ext.form.FieldSet',
'Ext.field.Toggle',
'Ext.Label'
],
// id: 'loginForm',
config: {
items: [
{
xtype : 'label',
html : 'Login failed. Please enter correct credentials.',
itemId : 'signInFailedLabel',
hidden : true,
hideAnimation : 'fadeOut',
showAnimation : 'fadeIn',
style : 'color:#990000;',
margin : 10
},
{
title: 'Please log in',
xtype: 'fieldset',
items:[
{
xtype: 'textfield',
name : 'username',
label: 'UserName'
},
{
xtype: 'passwordfield',
name : 'password',
label: 'Password'
}
]
},
{
xtype: 'fieldset',
items: [
{
xtype : 'togglefield',
name : 'rememberLogin',
label : 'Remember Me '
}
]
},
{
xtype : 'button',
id : 'loginSubmitBtn',
itemId : 'loginSubmitItemBtn',
text : 'Login',
ui : 'action',
action : 'login',
margin : 10
}
]
}
});
도움이 매우 감사하겠습니다!
편집 : 그래서 Ext.ComponentQuery.query("#loginSubmitBtn")
을 사용하고 콘솔에서 출력물을 인쇄 할 때 정확한 버튼을 가리키는 것을 볼 수 있습니다. 다음은 결과입니다.
0: Class
_badgeCls: "x-badge"
_baseCls: "x-button"
_disabledCls: "x-item-disabled"
_floatingCls: "x-floating"
_hasBadgeCls: "x-hasbadge"
_hiddenCls: "x-item-hidden"
_icon: false
_iconAlign: "left"
_itemId: "loginSubmitItemBtn"
_labelCls: "x-button-label"
_margin: 10
_pressedCls: "x-button-pressing"
_pressedDelay: 0
_styleHtmlCls: "x-html"
_text: "Login"
_ui: "action"
action: "login"
badgeElement: Class
bodyElement: Class
config: objectClass
currentUi: "x-button-action"
element: Class
eventDispatcher: Class
getEventDispatcher: function() {
getId: function() {
getObservableId: function() {
getUniqueId: function() {
iconElement: Class
id: "loginSubmitBtn"
initConfig: function(){}
initialConfig: Object
initialized: true
innerElement: Class
managedListeners: Object
observableId: "#loginSubmitBtn"
onInitializedListeners: Array[0]
parent: Class
referenceList: Array[4]
refreshFloating: function() {
refreshSizeState: function() {
renderElement: Class
rendered: true
textElement: Class
usedSelectors: Array[1]
__proto__: Object
length: 1
** EDIT 3 : ** 찾았습니다! 여기에 대답을 참조하십시오 : Sencha Tap listener not firing
콘솔에 오류가 없습니까? –
아무것도, 미안 해요! – javaCity