Javascript Ag Grid-如何为最后一行设置边框底部

我正在使用带有React的Ag网格，但我似乎无法确定如何显示最后一行之后的边框底部。没有它，网格看起来不完整。请参阅附件中的图像。

我尝试设置以下CSS，但不起作用：

.ag-footer-cell-entire-row {
    border-bottom: solid 1px black !important;
}

---

在文档中，我还查看了

rowStyle

属性并尝试使用它，但我不知道如何确定当前行是否是最后一行。如果有人能给我指出正确的方向，我将不胜感激

使用

rowStyle

非常接近。。。实际上，您需要使用

getRowStyle

，您需要根据返回CSS值的对象。下面是一个函数的示例：

gridOptions = {
    ...
    getRowStyle: lastRowBorder
    ...
}

function lastRowBorder(params){
    if (params.node.rowIndex == params.api.rowModel.rowsToDisplay.length - 1){
        return {border-bottom: thick green}
    }
    else {
        return {}
    }
}

我相信这种比较

params.node.rowIndex==params.api.rowModel.rowsToDisplay.length-1

在所有情况下都会起作用，但我自己还没有测试过。存在一个

params.api.lastChild

，但我不确定这是否仅适用于最后一行

节点

，还是适用于最后一个

节点

，适用于组。。。这就是你似乎在做的。在任何情况下，如果我提供的比较不起作用，那么

console.log

参数将是有益的

---

---

作为补充说明，在大多数情况下，尝试使用css选择器到达最后一个孩子并不是最干净的解决方案，因为ag grid依赖于绝对定位。。。这意味着网格中的最后一行可以在DOM

的中间，这是Google在AGGRID中设置“底部边界”时的最高结果。我遇到的问题是，将边框应用到网格体并不会在网格底部渲染边框（例如，不管有多少人行，我都希望网格本身有一个边框）。经过一些修补，这里是我的解决方案

.grid-container {
    height: 70%;
    margin: 10px 20px 0 20px;

    .ag-header {
        border: 1px solid black;
        border-bottom: none;
    }

    .ag-body {
        background-color: #fdfdfd;
        border-bottom: 1px solid black;
    }

    .ag-body-viewport-wrapper {
        border: 1px solid black;
        border-top: none;
    }

    .ag-body-viewport {
        border-bottom: 1px solid black;
    }

}

---

我会添加一些css，比如

table tr:last child{border bottom:…}

我刚刚尝试了这个，但似乎没有任何区别。不过，谢谢你的建议。我可能错误地在tr上设置了边框，而不是每个td，请检查它的工作位置（使用

table tbody tr:last child td

）@James，你发布的示例只是使用了一个我知道如何应用边框底部的表，但我的问题与ag网格组件有关。正如我在问题中提到的，当包含div的高度大于网格的高度时，我似乎无法显示边框底部。好的，同样的概念应该适用，父对象的最后一个可以通过css选择器访问，如

something whatever:last child

。奇怪的是，ag grid会使用表格以外的其他东西来显示表格数据，我想我需要做一些阅读。我必须修改比较，使之能够工作，即

params.node.rowIndex==params.api.rowModel.rowsToDisplay.length-1

。请编辑您的答案以反映这一更正。在分组行的情况下，

params.api.lastChild

不可靠，因为对于组的最后一个节点，它被设置为

true

。谢谢你的帮助@李纳斯！，谢谢你接电话。我已经更新了答案。在执行排序时，这不起作用。