Html 将图片添加到网格中-ExtJS

我（非常）不熟悉ExtJS，我正在尝试将图片添加到我的网格的一个字段中。 我已经在谷歌上寻找了一些结果或提示，我发现了“渲染功能”，但它不起作用（我的意思是，也许我只是用错了）

这是我的密码：

Ext.define('AM.view.user.List' ,{
  extend: 'Ext.grid.Panel',
  alias: 'widget.userlist',
  title: 'Test ',
  store: 'Users',
  initComponent: function() {
    this.columns = [
   {header: 'ID du CPE', dataIndex: 'ID',  flex: 1},
       {header: 'Modèle', dataIndex: 'Modele', flex: 1},
   {header: 'Firmware', dataIndex: 'firmware', flex: 1},
   {header: 'Année MeS', dataIndex: 'annee', flex: 1},
       {header: 'Statut', dataIndex: 'statut', flex: 1},
   {header: 'Alerte', dataIndex: 'alerte', flex: 1}   
    ];
    this.callParent(arguments);
  }
});

Json文件填充所有这些字段，但“Alerte”除外。 这是我想添加图片的地方（此字段中没有文本，只有图片）

提前谢谢，我希望我已经尽可能清楚了

Vincent

在列配置中添加：

{header: 'Alerte', dataIndex: 'alerte', flex: 1, renderer: function() {
return '<img src="blablabla"/>';
}}

{header:'Alerte'，dataIndex:'Alerte'，flex:1，renderer:function（）{
返回“”；
}}

---

请参阅文档以查看渲染器获得的参数，以便您可以根据实际记录自定义图像（如果需要）。

您可以使用

actioncolumn

在网格中显示单元格中的图标，并使用

渲染器

函数将图标放入单元格。在应用程序中使用css类的好规则。 以下是我的简单示例：

                   {
                        xtype: 'actioncolumn',
                        width: 70,
                        align: 'center',
                        dataIndex: 'yourDataIndex',
                        menuDisabled: 'true',
                        text: 'sometext',
                        sortable: false,
                        fixed: 'true',
                        renderer: function (value, metadata, record) {
                           metadata.tdCls = 'mycss'
                        }
                    }

你是css类的：

.mycss {
    background-position:center  !important;
    width: auto !important;
    background-repeat: no-repeat;
    background-image: url("yourIcon.png") !important; 
}