zoukankan      html  css  js  c++  java
  • ExtJs4学习(四):Extjs 中id与itemId的区别

       为了方便表示或是指定一个组件的名称,我们通常会使用id或者itemId进行标识命名。(推荐尽量使用itemId,这样可以减少页面唯一标识而产生的冲突)

    id:
      id是作为整个页面的Component的唯一标识,这也意味着在整个页面中只允许有唯一一个名称的id,同时这里的Component的id也将变为element中的id,所以如果出现了两个,页面将会出现崩塌变形等等不可以想象的问题。
      而作为一个组件是必须有自己的唯一标识(id)的,在没有设置Component的id的时候系统将自动为组件添加id

    itemId:
      itemId是用于container底下的元件的,这也说明itemId只是一个局部的元件标识名称,在全局上是不需要遵循唯一性的。
       从上面的叙述中可以看出一些使用上需注意的地方
    1. 若你要取得相关的Component 若是属于container 请设置id

    2. 若是只属于某个container 底下的元件,请设置itemId;某些情况下当然你也可以连同id 一起设置,比如需要改变css style,除此之外itmeid 还是优先的选择

    3. getCmp 以及getComponent 是不一样的,使用上必须注意,必须搭配id 以及itemid 使用

       如此一来id 与itemid 就会有从属关系,非必要不需定义id,也不会造成在定义id 时需要编码避免重覆,而因为itemid 是属于某个id 底下的,所以即使itemid 重覆,也可以利用唯一的id 利用Ext.getCmp 取得参照后,在接着使用getComponent 取得所属itemId 的参照。


    怎么获取id和itemId的组件和元件(从以上可以明显的看出,itemId是个局部的元件名称):

    id: Ext.getCmp(id);

    itemId:Ext.getCmp(id).getComponent(itemId);


    再看一段代码

    var c = new Ext.panel.Panel({ 
        height: 300,
        renderTo: document.body,
        layout: 'auto',
        items: [
            {
                itemId: 'p1',
                title: 'Panel 1',
                height: 150
            },
            {
                itemId: 'p2',
                title: 'Panel 2',
                height: 150
            }
        ]
    })
    p1 = c.getComponent('p1'); 
    p1 = c.child('#p1'); 
    
    p2 = p1.ownerCt.getComponent('p2');
    p2 = p1.ownerCt.child('p2');

    p1,p2中的itemid换成id,用p1 = c.child('#p1')方式获取; 同样也是可以获取到的,但肯定不合适,

    你可以想象下,如果你再创建了一个c呢,id就重复了。

    我们可以简单的理解为id是全局变量,itemid是局部变量

  • 相关阅读:
    怎么看到数据库以前做过的日志?
    感觉很好的网站
    uview 滑动切换
    Flyweight享元(结构型模式)
    悟空,真的是空?
    Interpreter解释器(行为型模式)
    Proxy代理(结构型模式)
    [转]有一种爱叫索取
    Command命令(行为型模式)
    Composite组合(结构型模式)
  • 原文地址:https://www.cnblogs.com/love-omnus/p/4196569.html
Copyright © 2011-2022 走看看