extjs - 网格单元同时具有图像和文本

Question

有没有办法在 Ext js 4 网格面板的单元格上同时放置图像和文本？

感谢帮助。

ck

Answer 1

是的你可以。但取决于您的要求选择哪种方式。

1. 使用 CSS。定义列时，设置“tdCls”属性：

   {
       header: 'Image and text column',
       tdCls: 'img-col',
       dataIndex: 'Text'
   }
   

   在 CSS 文件中：

   td.img-col  {
       background-image: url(images/pic.png); /*16px*/
       background-repeat: no-repeat;
   }
   
   td.img-col .x-grid-cell-inner {
       margin-left: 16px;
   }
   

2. 使用模板列：

   {
       xtype: 'templatecolumn',
       header: 'Image and text column',
       tpl: [
           '<img src="{ImgPath}"></img>',
           '<div>{Text}</div>'
       ]
   }
   

   你的模型应该有这个ImgPath属性