여러 항목에 대한 Sencha Touch 이벤트 대리자

Question

여러 항목에 대한 이벤트를 공통 클래스 이름으로 위임하려고하지만 작동하지 않는 것 같습니다. 여러 ID에 대한 위임이 작동하지만 "잘못된 ComponentQuery 선택기"라는 오류 메시지가 표시됩니다.

이것은 내가 지금 무엇을 가지고 :와 "CLS : 목록"

Ext.define("App.view.Main", { 
    extend : "Ext.Container", 

    config : { 
     listeners : { 
      disclose : { 
       fn : "onElementDisclose", 
       delegate : [ "#onelist", "#anotherlist" ] // this don't work 
       // delegate : ".lists" <- this also don't work 
       // delegate : "#onelist, #anotherlist" <- this don't work either 
       // delegate : "#onelist" <- but this work! 
      } 
     }, 
    }, 

    initialize : function() { 
     this.callParent(arguments); 

     this.add([ { 
      xtype : "slideshow", 
     }, { 
      xtype : "onelist", 
     }, { 
      xtype : "anotherlist", 
     } ]); 
    }, 

    onElementDisclose : function() { 
     console.log("click"); 
    }, 

}); 

두리스트는 "사실 onItemDisclosure"가.

어떻게하면 좋을까요 ??

Answer 1

보기에서 청취자를 정의하는 여러 컨트롤에서 공통 이벤트를 사용하여 같은 기능을 실행할 수 없습니다.

예 컨트롤러에서 동일한 작업을 수행 할 수 있습니다. 그것은이 확실히 정도 작동 Sachin에게 .. 의심 할 여지없이

Answer 2

을

감사 을 작동하고 여기에 입증 된 바와 같이 당신은 컨트롤러에 위임 할 필요가 없습니다 :

Ext.application({ 
    name: 'Fiddle', 

    launch: function() { 
     Ext.create('Ext.Panel', { 
      fullscreen: true, 
      title: 'Test', 
      layout: 'vbox', 
      items: [{ 
       xtype: 'panel', 
       layout: 'fit', 
       flex: 1, 
       items: [{ 
        docked: 'top', 
        xtype: 'titlebar', 
        title: 'List 1' 
       }, { 
        xtype: 'list', 
        name: 'list 1', 
        cls: 'myList', 
        id: 'list1', 
        onItemDisclosure: true, 
        itemTpl: "List1 item {name}", 
        model: Ext.define('User', { 
         extend: 'Ext.data.Model', 

         config: { 
          fields: [{ 
           name: 'name', 
           type: 'string' 
          }] 
         } 
        }), 
        data: [{ 
         name: 'John' 
        }, { 
         name: 'Jane' 
        }] 
       }] 
      }, { 

       xtype: 'panel', 
       layout: 'fit', 
       flex: 1, 
       items: [{ 
        docked: 'top', 
        xtype: 'titlebar', 
        title: 'List 2' 
       }, { 
        xtype: 'list', 
        name: 'list 2', 
        cls: 'myList', 
        id: 'list2', 
        onItemDisclosure: true, 
        itemTpl: "List2 item {make}", 
        model: Ext.define('Car', { 
         extend: 'Ext.data.Model', 

         config: { 
          fields: [{ 
           name: 'make', 
           type: 'string' 
          }] 
         } 
        }), 
        data: [{ 
         make: 'Volkswagen' 
        }, { 
         make: 'Audi' 
        }] 
       }] 
      }], 

      listeners: { 
       disclose: { 
        fn: function(list, record, target, index, e, eOpts) { 
         console.log(list); 
         var greeting = ''; 
         if (typeof(record.data.make) != 'undefined') { 
          greeting = "I am a car and my make is " + record.data.make + "!"; 
         } else if (typeof(record.data.name) != 'undefined') { 
          greeting = "I am a user and my name is " + record.data.name + "!"; 
         }; 
         console.log('disclosing from list ' + list.config.name, greeting); 

        }, 
        // delegate : 'list' // this works as you are querying by xtype of list 
        // delegate : 'component [onItemDisclosure]' // this works as you are targeting by attribute of onItemDisclosure 
        // delegate : '[onItemDisclosure]' // this works as you are targeting by attribute 
        // delegate : '[name="list 1"]' // this works as you are targeting by attribute of name = 'list 1' 
        // delegate : '[cls="myList"]' // this unfortunately doesn't work 
        // delegate : "#list1, #list2" <- this don't work either 
        // delegate : "#list1" <- but this work! 
       } 
      } 
     }); 
    } 
}); 

그러나 몇 가지가 있습니다 당신이 볼 수있는 위의 함정.

데모 : https://fiddle.sencha.com/#fiddle/g49