Extjs 5.1 事件在 Ext.select.不能在 Ext.dom.Fly 实例上使用 addListener(）

Extjs 5.1 Event on a Ext.select. Cannot use addListener() on Ext.dom.Fly instances

本文关键字：Ext addListener 实例 dom 事件 select Extjs 不能 Fly      更新时间：2023-09-26

我正在学习EXTjs。我正在回顾本教程，并从那里玩提示。当我发现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 的新手。任何帮助，不胜感激。

该错误几乎解释了正在发生的事情。您不能将事件绑定到蝇量级元素包装器Ext.dom.Fly的实例，因为这是一个被重用的轻量级对象，并且实际上仅在下次调用 Ext.select 之类的东西之前有效。

这在 ExtJS 4.2 下起作用的原因是Ext.select()调用的结果 - 一个Ext.dom.CompositeElementLite实例 - 曾经与Ext.dom.Element类一起使用。出于性能原因，在 ExtJS 5 中，它现在使用 Ext.dom.Fly 。

改用Ext.select('p', true);这将创建不使用蝇量级版本的Ext.dom.CompositeElement实例。

相关文章：