要检测页面数据是从AgGrid的内部存储(缓存)加载还是从端点加载,可以使用AgGrid的事件回调函数和API来实现。以下是一个示例解决方法:
isLoadedFromCache
。const columnDefs = [
{ headerName: 'Name', field: 'name', isLoadedFromCache: true },
{ headerName: 'Age', field: 'age', isLoadedFromCache: false },
// 其他列定义...
];
onFirstDataRendered
事件回调函数中,遍历所有的列定义,检查每个列的isLoadedFromCache
属性,并根据数据加载来源设置相应的值。function onFirstDataRendered(params) {
const { columnApi, api } = params;
const allColumns = columnApi.getAllColumns();
allColumns.forEach(column => {
const { colDef } = column;
const isLoadedFromCache = colDef.isLoadedFromCache;
if (isLoadedFromCache) {
// 从内部存储(缓存)加载的数据
// 设置相应的样式或其他逻辑
// 例如:column.setCellClass('loaded-from-cache');
} else {
// 从端点加载的数据
// 设置相应的样式或其他逻辑
// 例如:column.setCellClass('loaded-from-endpoint');
}
});
}
const gridOptions = {
// 其他配置...
onFirstDataRendered: onFirstDataRendered,
};
.ag-cell.loaded-from-cache {
background-color: lightgreen;
}
.ag-cell.loaded-from-endpoint {
background-color: lightblue;
}
使用以上方法,当AgGrid的数据加载完成后,会根据列定义中的isLoadedFromCache
属性判断数据加载来源,并设置相应的样式或其他逻辑。