如何格式化 ExtJS treegrid 边框

Question

所以我认为在 extjs treegrid 中格式化边框是基本的，但经过数小时的尝试和环顾四周后，我无法找到解决方案。我遇到的问题是我的边框外观和宽度在列和行之间不一致（尝试附加屏幕截图，但自从新站点以来就不能）。我尝试在列创建中直接定义边框：

columns:[{header: 'H6',dataIndex: 'hour6',width: 210, border: 1}]

以及在我设置单元格背景颜色的 XTemplate 中（不认为这会起作用，但我想我会尝试）：

columns: [{header: 'H6',dataIndex: 'hour6',width: 210,              
    tpl: new Ext.XTemplate('{duration1:this.doFormat}', {
        doFormat: fn(v){
            if (v == 1) {return '<span style="background-color: red; width: 100%; border: 1">' + v + '</span>';}
        else {return '<span style="background-color:' + currentcolor + '; width: 100%; border: 1">' + v + '</span>';}
        }
    })
}]

有谁知道如何格式化 treegrid 边框来解决这个问题？

谢谢。

Answer 1

您最好通过列定义的 cls 配置选项使用 css 类，或者直接在列元素上操作 css 样式。网格行之间的边界在 .x-treegrid-col 类上设置。

// set the border on all rows to red
.x-treegrid-col {
    border-bottom: 1px solid red;
}

不过，我不完全确定您想要实现什么，请将屏幕截图上传到 http://tinypic.com/ 并将指向它的链接嵌入到您的原始帖子中，这可能会有所帮助。