我是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元素.例如:
- <html>
- <body>
- <div id="target">Hello,world!</div>
- </body>
- </html>
ext.get(‘target’)将返回div#target DOM元素.
我个人从不使用任何一个.相反,我使用ComponentQuery定位组件,然后检索其DOM元素,如下所述.
MyCmp.getEl()VS MyCmp.el
两者都只是检索MyCmp组件的顶级DOM元素.
当前版本的ExtJS(4.2.1)定义了.getEl()函数,如下所示:
- MyCmp.getEl = function () {
- return this.el;
- }
这意味着MyCmp.getEl()和MyCmp.el绝对相等.
使用.el,如果你喜欢保持你的代码很短,甜蜜.然而,.getEl()可能会在以后的情况下使用ExtJS向组件的DOM元素检索过程添加额外的逻辑(例如,先检查它是否存在).
我喜欢.el.
MyCmp.hide()VS MyCmp.el.hide()
MyCmp.hide()和MyCmp.el.hide()是两个不同的功能.当前版本的ExtJS(4.2.1)定义如下:
- MyCmp.hide = function (animateTarget,cb,scope) {
- var me = this,continueHide;
- if (me.pendingShow) {
- delete me.pendingShow;
- } if (!(me.rendered && !me.isVisible())) {
- continueHide = (me.fireEvent('beforehide',me) !== false);
- if (me.hierarchicallyHidden || continueHide) {
- me.hidden = true;
- me.getHierarchyState().hidden = true;
- if (me.rendered) {
- me.onHide.apply(me,arguments);
- }
- }
- }
- return me;
- }
和
- MyCmp.el.hide = function (animate){
- if (typeof animate == 'string'){
- this.setVisible(false,animate);
- return this;
- }
- this.setVisible(false,this.anim(animate));
- return this;
- }
然而,这两个功能似乎都产生了相同的结果.他们只是添加一个style =“display:none;”到组件的DOM元素.
我使用MyCmp.hide().