handleDataSrc(List<dynamic> dataSrc) {
final List<PlutoRow> rows = dataSrc.map((dynamic item) {
Map<String, PlutoCell> cells = {};
for (var key in item.keys) {
if (item[key] != null) {
cells[key] = PlutoCell(value: "${item[key]}");
}
}
PlutoRow row = PlutoRow(cells: cells);
return row;
}).toList();
return rows;
}
// this way will not work
// var rows = handleDataSrc(widget.dataSrc);
var rows = [
PlutoRow(
cells: {
'id': PlutoCell(value: "6580910ddc65492c839bf6e9"),
'shipmentID': PlutoCell(value: 'xxx'),
'companyCode': PlutoCell(value: 'AAR'),
'shipmentETD': PlutoCell(value: 'xxxx'),
'shipmentETA': PlutoCell(value: 'xxxx'),
'createdAt': PlutoCell(value: '2021-01-01'),
'updatedAt': PlutoCell(value: 'xxxx'),
},
)
];
I handle the data source in code, and I check the variables in side tabs, it's all ok, but the view will not show the data . don't know what's wrong. if I write the rows literally, it will work! really need help !!! although I think it may be a tiny issue in code, many thanks!!
work:
not work with the rows shows below
1. The values have been checked for excluding null value
2. checked the pic above for the keys are totally matched
When PlutoGrid is initially rendered, the rows are an empty list, and after asynchronously fetching the data, the view is not updated. You can try using a boolean loading state for conditional rendering of PlutoGrid.
body: Container(
padding: const EdgeInsets.all(30),
child: loading ? const Center(child: Text('Loading'),) : PlutoGrid(
columns: columns,
rows: rows,
onChanged: (PlutoGridOnChangedEvent event) {
print(event);
},
onLoaded: (PlutoGridOnLoadedEvent event) {
print(event);
}
),
),