Question

我想在面板中添加一个按钮，直到我点击的确切位置。

所以我尝试了如下，这是我的Ext.widget元素

的结构

Ext.widget（{ xtype：'mz-form-widget'， itemId：'shopableImage'，锚：“100％”，

    defaults: {
        xtype: 'textfield',
        listeners: {
            controller: '',
            change: function (cmp) {
                controller = cmp;
                cmp.up('#shopableImage').updatePreview();
            }
        }
    },


    items: [
        {
            xtype: "tacofilefield",
            itemId: "imageUploadButton",
            text: "Upload images"
        },
        {
            xtype: 'panel',
            width: 350,
            height: 350,
            itemId:'container',
            id:'container',
            bodyStyle:{"background":"url('http://www.easyvectors.com/assets/images/vectors/vmvectors/jeans-girl-vector-27.jpg')","border":"1px solid #eee"},
            listeners: {
                click: {
                    element: 'el', //bind to the underlying el property on the panel
                    fn: function(a,b,c,d){ 
                        console.log(a.browserEvent.clientX - b.offsetLeft);
                        console.log(a.browserEvent.clientY - b.offsetTop);
                        console.log(c);
                       this.down('#container').addItem({"xtype":"button","text":"+"});
                    }
                },
                dblclick: {
                    element: 'body', //bind to the underlying body property on the panel
                    fn: function(){ console.log('dblclick body'); }
                }
            }
        }

以下行告诉我错误。的 this.down('#container').addItem({"xtype":"button","text":"+"}); 的更新

this.down('#container')

返回null。

请告诉我你的建议吗？

Answer 1

这里有两个问题，一个是导致错误，另一个是潜在的定时炸弹：

addItem不存在，正确的方法名称为add
你在组件上使用id，这是一个非常糟糕的做法，但是，它不是错误的直接原因

如何在单击面板时将项目添加到ext js面板？

1 个答案: