ag-Grid 单元格数据的值是由 gridOptions
对象中的 rowData
属性提供的。rowData
是一个数组,其中的每个元素代表一个数据行。每个数据行包含一个或多个属性,这些属性对应于 ag-Grid 中的列。
以下是一个使用 ag-Grid 的示例代码,展示了如何设置 rowData
和列定义,以及如何获取单元格数据的值:
// 设置 rowData,每个元素代表一个数据行
var rowData = [
{ make: "Toyota", model: "Celica", price: 35000 },
{ make: "Ford", model: "Mondeo", price: 32000 },
{ make: "Porsche", model: "Boxter", price: 72000 }
];
// 列定义
var columnDefs = [
{ headerName: "Make", field: "make" },
{ headerName: "Model", field: "model" },
{ headerName: "Price", field: "price" }
];
// 创建 ag-Grid 实例,并传入 rowData 和 columnDefs
var gridOptions = {
rowData: rowData,
columnDefs: columnDefs
};
// 将 ag-Grid 实例挂载到指定的 DOM 元素上
var gridDiv = document.querySelector("#myGrid");
new agGrid.Grid(gridDiv, gridOptions);
// 获取第一行的 make 列的值
var firstMake = gridOptions.api.getValue("make", 0);
console.log(firstMake); // 输出 "Toyota"
在上述代码中,rowData
数组包含了三个数据行,每个数据行都有 make
、model
和 price
属性。columnDefs
数组定义了三个列,分别是 "Make"、"Model" 和 "Price"。
然后,通过传入 rowData
和 columnDefs
创建了一个 ag-Grid 实例,并将其挂载到指定的 DOM 元素上。
最后,通过调用 gridOptions.api.getValue()
方法可以获取指定单元格的值。在示例中,我们获取了第一行的 "make" 列的值,即 "Toyota",并将其输出到控制台。
请注意,上述示例代码中的 ag-Grid 版本可能会有所不同,因此您可能需要根据您使用的 ag-Grid 版本进行一些调整。