javascript - ExtJS Container 将现有内容设置为项目

Question

我是 ExtJS 的新手，并尝试重用一些使用 jQuery 生成的现有内容。有没有一种简单的方法可以将现有组件添加为容器中的项目？

我的代码看起来像这样

var rect = $('<div>', {
    'id' : 'rectangle'
}).text("this is a rectangle.");

var cont = new Ext.Container({
    layout : 'absolute',
    width : 400,
    height : 300,
    renderTo : Ext.getBody(),
    border : 1,
    style : {
        borderColor : '#000000',
        borderStyle : 'solid',
        borderWidth : '1px'
    },
    items : [{
        html : rect
    }]
});

Answer 1

只需使用.html()

items : [{
    html : rect.html()
}]

Answer 2

最好的方法是使用contentEl. 请注意，这会在组件内部移动元素，因此当组件被销毁时，元素也会被销毁。

items: {
    contentEl: rect.get(0) // Grab a reference to the DOM element
}

如果要在移动元素之前对其进行复制，可以调用： rect.clone.get(0);