要在ag Grid所有格网事件完成之前不显示数据,可以使用ag Grid的onGridReady
事件来实现。
首先,确保在HTML中引入了ag Grid的库文件:
然后,在JavaScript代码中,使用onGridReady
事件来初始化ag Grid,并在事件处理程序中设置gridOptions
的suppressLoadingOverlay
和suppressNoRowsOverlay
属性为true
:
// 创建一个空的ag Grid实例
var gridOptions = {
// 设置为true将隐藏加载覆盖层
suppressLoadingOverlay: true,
// 设置为true将隐藏没有数据时的覆盖层
suppressNoRowsOverlay: true,
// 其他配置项...
};
// 当Grid准备就绪时触发
function onGridReady(params) {
// 隐藏Grid的加载覆盖层和没有数据时的覆盖层
params.api.showLoadingOverlay();
params.api.showNoRowsOverlay();
// 执行异步操作,如从服务器加载数据
loadData(function(data) {
// 数据加载完成后,显示数据
params.api.setRowData(data);
// 隐藏加载覆盖层和没有数据时的覆盖层
params.api.hideOverlay();
});
}
// 加载数据的示例函数
function loadData(callback) {
// 模拟异步请求
setTimeout(function() {
var data = [
// 数据...
];
callback(data);
}, 1000);
}
// 创建Grid并将其附加到DOM元素
var gridDiv = document.querySelector('#myGrid');
new agGrid.Grid(gridDiv, gridOptions);
最后,在HTML中,添加一个包含ag Grid的DOM元素:
请根据自己的实际需求修改代码中的配置项、数据加载逻辑等。