Extjs 5.1 Ext.select의 이벤트. Ext.dom.Fly 인스턴스에 addListener()를 사용할 수 없습니다.

Question

EXTjs를 배우고 있습니다. 거기에서 힌트를 가지고 노는 this tutorial을 검토하고있었습니다. Ext.select('p').on('click', paragraphClicked);이 오류를 발생시키는 것을 발견했습니다.

"[E] Ext.dom.Fly.addListener(): Cannot use addListener() on Ext.dom.Fly instances. Please use Ext.get() to retrieve an Ext.dom.Element instance instead." 
{msg: "Cannot use addListener() on Ext.dom.Fly instances. Please use Ext.get() to retrieve an Ext.dom.Element instance instead.", sourceMethod: "addListener", sourceClass: "Ext.dom.Fly"} 

Jsfiddle 콘솔에서이 버그를 찾을 수 있습니다.

HTML :

<input type="button" id="myButton" value="My Button" /> 
<p>first paragraph</p> 
<p class="myClass">second paragraph</p> 
<p>third one</p> 

JS :

Ext.onReady(function() { 
var paragraphClicked = function(e) { 
    Ext.get(e.target).highlight(); 
}; 

Ext.select('p').on('click', paragraphClicked); 

}); 

, 당신은 잘못 걸 설명 할 수 바랍니다 그리고 여기 소스입니다. Ext.select를 사용하여 선택한 요소에 이벤트를 바인딩하는 방법은 무엇입니까? 그것은 ExtJS 4와 함께 작동하며 5와 작동하지 않습니다. Ext.js의 초보자라고 생각해보십시오. 어떤 도움을 주셔서 감사합니다.

Answer 1

오류로 인해 무슨 일이 일어나는지 설명합니다. 플라이급 Element 래퍼 Ext.dom.Fly의 인스턴스에 이벤트를 바인딩 할 수 없습니다.이 인스턴스는 재사용되는 가벼운 객체이기 때문에 실제로는 Ext.select과 같은 다음 호출까지만 유효합니다.

ExtJS 4.2에서 작동하는 이유는 클래스와 함께 사용되는 Ext.dom.CompositeElementLite 인스턴스의 Ext.select() 호출 결과 때문입니다. 성능상의 이유로 ExtJS 5에서는 이제 Ext.dom.Fly을 사용합니다.

대신 Ext.select('p', true)을 사용하십시오. 플라이 웨이트 버전을 사용하지 않는 Ext.dom.CompositeElement의 인스턴스가 생성됩니다.