Ext JS 4.1 - 如何动态渲染图像？

Question

我需要在某些事件后重新渲染图像（ Ext.Image ）。 我找到了doComponentLayout功能，但遗憾的是它对我不起作用。

如何重新渲染作为表格项目的图像？

Answer 1

有一种常见的技术可以在图像的src处添加?和随机字符串。服务器忽略了src的这一部分，但浏览器认为你正在设置新的src。

var originalSrc = 'http://example.com/someimg.png';
var antiCachePart = (new Date()).getTime();
var newSrc = originalSrc + '?dc=' + antiCachePart;
// now newSrc is equal to something like "http://example.com/someimg.png?dc=1352748617627"
img.setSrc(newSrc);

Answer 2

在Ext.Img的文档中说：

var changingImage = Ext.create('Ext.Img', {
    src: 'http://www.sencha.com/img/20110215-feat-html5.png',
    renderTo: Ext.getBody()
});

// change the src of the image programmatically
changingImage.setSrc('http://www.sencha.com/img/20110215-feat-perf.png');

Answer 3

我以前从未使用过Ext.Image，但一般来说，当我们需要重新渲染图像时，我们会做两件事之一：破坏和重新创建组件，或者将图像放在DataView或其他内容中模板驱动的组件并重新呈现模板。

doComponentLayout仅适用于我相信的大小，它不会重新生成组件。如果你不能将图像放在XTemplate驱动的组件中，那么破坏和重新创建组件可能是最好的选择。