我正在尝试使用创建表AdvancedPaginatedDataTable
,但数据未显示,而 api 返回数据。
这是代码
class MyHomePage extends StatefulWidget {
MyHomePage({Key? key, this.title}) : super(key: key);
final String? title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
var rowsPerPage = AdvancedPaginatedDataTable.defaultRowsPerPage;
final source = ExampleSource();
var sortIndex = 0;
var sortAsc = true;
DataRow? getRow(int index) {
final contact = source.lastDetails!.rows[index];
return DataRow(cells: [
DataCell(Text(contact.id.toString())),
DataCell(Text(contact.companyName)),
DataCell(Text(contact.firstName)),
DataCell(Text(contact.lastName)),
DataCell(Text(contact.phone.toString())),
]);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title!),
),
body: SingleChildScrollView(
child: AdvancedPaginatedDataTable(
getRow: getRow,
addEmptyRows: false,
source: source,
sortAscending: sortAsc,
sortColumnIndex: sortIndex,
showFirstLastButtons: true,
rowsPerPage: rowsPerPage,
availableRowsPerPage: [10, 20, 30, 50],
onRowsPerPageChanged: (newRowsPerPage) {
if (newRowsPerPage != null) {
setState(() {
rowsPerPage = newRowsPerPage;
});
}
},
columns: [
DataColumn(label: Text('ID'), numeric: true, onSort: setSort),
DataColumn(label: Text('Company'), onSort: setSort),
DataColumn(label: Text('First name'), onSort: setSort),
DataColumn(label: Text('Last name'), onSort: setSort),
DataColumn(label: Text('Phone'), onSort: setSort),
],
),
),
);
}
void setSort(int i, bool asc) => setState(() {
sortIndex = i;
sortAsc = asc;
});
}
class ExampleSource extends AdvancedDataTableSource<Contact> {
@override
int get selectedRowCount => 0;
@override
Future<RemoteDataSourceDetails<Contact>> getNextPage(NextPageRequest pageRequest) async {
final queryParameter = <String, dynamic>{
'offset': pageRequest.offset.toString(),
'pageSize': pageRequest.pageSize.toString(),
'sortIndex': ((pageRequest.columnSortIndex ?? 0) + 1).toString(),
'sortAsc': ((pageRequest.sortAscending ?? true) ? 1 : 0).toString(),
};
final requestUri = Uri.http(
'example.devowl.de',
'',
queryParameter,
);
final response = await http.get(requestUri);
if (response.statusCode == 200) {
print(response.body);
final books = json.decode(response.body);
return RemoteDataSourceDetails(
books['totalRows'],
(books['rows'] as List<dynamic>)
.map((json) => Contact.fromJson(json))
.toList(),
);
} else {
throw Exception('Unable to query remote server');
}
}
}
print(response.body);
this line prints me the data in console
联系方式.dart
class Contact {
final int id;
final String companyName;
final String firstName;
final String lastName;
final int phone;
Contact({
required this.id,
required this.firstName,
required this.companyName,
required this.lastName,
required this.phone
});
factory Contact.fromJson(Map<String, dynamic> json) => Contact(
id: json['id'],
firstName: json['firstName'],
companyName: json['companyName'],
lastName: json['lastName'],
phone: json['phone'],
);
Map<String, dynamic> toJson() => {
'id': id,
'companyName': companyName,
'firstName': firstName,
'lastName': lastName,
'phone': phone,
};
}
输出:
如果有人知道解决方案,请告诉我。