2

在我看来 Sencha 中我需要一个真正的<img>HTML 标签。

我从官方文档中检索到了这段代码：

Ext.define('Ext.ux.Image', {
    extend: 'Ext.Component', // subclass Ext.Component
    alias: 'widget.managedimage', // this component will have an xtype of 'managedimage'
    autoEl: {
        tag: 'img',
        src: Ext.BLANK_IMAGE_URL,
        cls: 'my-managed-image'
    },

    // Add custom processing to the onRender phase.
    // Add a ‘load’ listener to the element.
    onRender: function() {
        this.autoEl = Ext.apply({}, this.initialConfig, this.autoEl);
        this.callParent(arguments);
        this.el.on('load', this.onLoad, this);
    },

    onLoad: function() {
        this.fireEvent('load', this);
    },

    setSrc: function(src) {
        if (this.rendered) {
            this.el.dom.src = src;
        } else {
            this.src = src;
        }
    },

    getSrc: function(src) {
        return this.el.dom.src || this.src;
    }
});

当我尝试执行setSrc时，出现此错误：无法读取未定义的属性“dom”

4

1 回答 1

2

您的代码来自 Ext.Js 4.x 文档。您应该使用 sencha touch 2 文档。请比较： http ://docs.sencha.com/ext-js/4-1/#!/api/Ext.Component

和

http://docs.sencha.com/touch/2-0/#!/api/Ext.Component

它们是不同的。

据我了解，您的视图中需要真正的 < img > 标签。如果您使用 Ext.Img，它将创建一个带有背景图像的 div 容器。我知道两种方法：

  1. 设置 tpl 和 data 属性。
Ext.create('Ext.Component', {
  配置：{
    tpl：''，
    数据： {
      网址：'http://example.com/pics/1.png',
      imgClass: '我的班级'
    }
  }
});
  1. 设置html配置。
Ext.create('Ext.Component', {
    配置：{
    html: '<img class="my-class" src="http://example.com/pics/1.png">'
    }
});
于 2012-05-29T11:53:42.117 回答