javascript – 可以请详细解释.el,getEl(),Ext.get()吗?

前端之家收集整理的这篇文章主要介绍了javascript – 可以请详细解释.el,getEl(),Ext.get()吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我是Sencha ExtJs的新手

我不明白Ext.getCmp(‘component_id’)行.getEl().hide();.什么是.getEl()的使用.我可以写Ext.getCmp(‘component_id’).hide();直?

并解释我关于.el,Ext.get()也.

解决方法

Ext.getCmp()VS Ext.get()

Ext.getCmp()在ExtJS组件树中找到一个现有的(已创建)组件.请注意,不要使用它.依靠ComponentQuery而不是.

Ext.get()通过id找到一个DOM元素.例如:

  1. <html>
  2. <body>
  3. <div id="target">Hello,world!</div>
  4. </body>
  5. </html>

ext.get(‘target’)将返回div#target DOM元素.

我个人从不使用任何一个.相反,我使用ComponentQuery定位组件,然后检索其DOM元素,如下所述.

MyCmp.getEl()VS MyCmp.el

两者都只是检索MyCmp组件的顶级DOM元素.

当前版本的ExtJS(4.2.1)定义了.getEl()函数,如下所示:

  1. MyCmp.getEl = function () {
  2. return this.el;
  3. }

这意味着MyCmp.getEl()和MyCmp.el绝对相等.

使用.el,如果你喜欢保持你的代码很短,甜蜜.然而,.getEl()可能会在以后的情况下使用ExtJS向组件的DOM元素检索过程添加额外的逻辑(例如,先检查它是否存在).

我喜欢.el.

MyCmp.hide()VS MyCmp.el.hide()

MyCmp.hide()和MyCmp.el.hide()是两个不同的功能.当前版本的ExtJS(4.2.1)定义如下:

  1. MyCmp.hide = function (animateTarget,cb,scope) {
  2. var me = this,continueHide;
  3. if (me.pendingShow) {
  4. delete me.pendingShow;
  5. } if (!(me.rendered && !me.isVisible())) {
  6. continueHide = (me.fireEvent('beforehide',me) !== false);
  7. if (me.hierarchicallyHidden || continueHide) {
  8. me.hidden = true;
  9. me.getHierarchyState().hidden = true;
  10. if (me.rendered) {
  11. me.onHide.apply(me,arguments);
  12. }
  13. }
  14. }
  15. return me;
  16. }

  1. MyCmp.el.hide = function (animate){
  2. if (typeof animate == 'string'){
  3. this.setVisible(false,animate);
  4. return this;
  5. }
  6. this.setVisible(false,this.anim(animate));
  7. return this;
  8. }

然而,这两个功能似乎都产生了相同的结果.他们只是添加一个style =“display:none;”到组件的DOM元素.

我使用MyCmp.hide().

猜你在找的JavaScript相关文章