时间戳

首页 > 解决方案 > 如何将 TableRow 动态添加到 Table 中？

json - 如何将 TableRow 动态添加到 Table 中？

问题描述

我正在尝试在我的表中动态添加行。但不是添加行，它只是更新我的行值。

图片

用于测试的 Json 响应。

{
  "EncPartnerId": "LEuT1eIlpLEMAAkZme3wpQ==",
  "EncTestId": "U4exk+vfMGrn7cjNUa/PBw==",
  "Fee": "100",
  "DiscountedFee": "80",
  "BookingFee": "50"
}

我的 API 功能通过按下Add按钮我试图在我的表中添加测试名称和他们的数据

   Future<void> GetTestFee() async {
var jsonResponse;
if (encTestId.isNotEmpty) {
  var response = await http.post(
      Uri.parse("http://myapitp.in/api/api/endpoint"),
      body: ({
        'EncPartnerId': encLabId,
        'EncTestId': encTestId,

      }));
  if (response.statusCode == 200) {
    print("Correct");
    print(response.body);
    jsonResponse = json.decode(response.body.toString());
    print(jsonResponse);
    getTestFeeObj=GetTestFeeMap.fromJson(jsonResponse);

  } else {
    throw Exception("Faild to fetch");
  }
} else {
  throw Exception("Faild to fetch");
}
return GetTestFee();

}

然后将其打印为 DataTable。我认为这不是正确的方法。我也尝试在build方法中预先创建一个空列表，List<TableRow> tableRows = [];但不知道如何在该列表中填充数据。

  SingleChildScrollView(
            scrollDirection: Axis.horizontal,
            child: DataTable(
              columnSpacing: 13.0,
              columns: <DataColumn>[
                //DataColumn(label: Text("encPartnerId")),
                //DataColumn(label: Text("encTestId")),
                DataColumn(label: Text("TestName")),
                DataColumn(label: Text("Fee")),
                DataColumn(label: Text("Discounted Fee")),
                DataColumn(label: Text("Booking Fee")),
              ],
             rows: <DataRow>[
              DataRow(
                 cells: <DataCell>[
                // DataCell(Text(user?.encPartnerId ?? 'encPartnerId')),
                // DataCell(Text(user?.encTestId ?? 'encPartnerId')),
                DataCell(Container(child: Text(testName?? '',overflow: TextOverflow.ellipsis))),
                DataCell(Text(getTestFeeObj?.fee ?? '')),
                DataCell(Text(getTestFeeObj?.discountedFee ?? '')),
                DataCell(Text(getTestFeeObj?.bookingFee ?? '')),
               ],
              )
             ]
             ),
          )

标签： jsonflutterapidart

解决方案

json响应

 {
  "EncPartnerId": "LEuT1eIlpryry",
  "EncTestId": "U4exk+vfMyry",
  "Fee": "100",
  "DiscountedFee": "80",
  "BookingFee": "50"
 }

我的 JSON 响应模型类

  class GetTestFeeMap { // Need this class
  String? encPartnerId;
  String? encTestId;
  int? fee;
  int? discountedFee;
  int? bookingFee;

  GetTestFeeMap(
      {this.encPartnerId,
      this.encTestId,
      this.fee,
      this.discountedFee,
      this.bookingFee});

  GetTestFeeMap.fromJson(Map<String, dynamic> json) {
    encPartnerId = json['EncPartnerId'];
    encTestId = json['EncTestId'];
    //fee = json['Fee'];
    fee = int.parse(json['Fee']);
    // discountedFee = json['DiscountedFee'];
    discountedFee = int.parse(json['DiscountedFee']);
    //bookingFee = json['BookingFee'];
    bookingFee = int.parse(json['BookingFee']);
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['EncPartnerId'] = this.encPartnerId;
    data['EncTestId'] = this.encTestId;
    data['Fee'] = this.fee;
    data['DiscountedFee'] = this.discountedFee;
    data['BookingFee'] = this.bookingFee;
    return data;
  }
}

  • 我在里面拿了一个空的 List[]state

    List<GetTestFeeMap> reponseArray = [];// 存储 API 响应 || 稍后以表格形式显示考试费用

  • 获得 API 响应后将其添加到列表中

     var response = await http.post(
   Uri.parse("http://ytyttiiiuiu.in/api/myapi/GetTestFee"),
   body: ({
     'EncPartnerId': encLabId,
     'EncTestId': encTestId
     }));
 if (response.statusCode == 200) {
  print("Correct");
   print(response.body);
   jsonResponse = json.decode(response.body.toString());
   print(jsonResponse);

   getTestFeeObj=GetTestFeeMap.fromJson(jsonResponse);
   reponseModel.add(getTestFeeObj) // Here adding my response to list[]

然后将这些数据映射到我的 DataTable

 child: DataTable(
                  columnSpacing: 13.0,
                  columns: <DataColumn>[
                    DataColumn(label: Text("Fee")),
                    DataColumn(label: Text("Discounted Fee")),
                    DataColumn(label: Text("Booking Fee")),
                  ],
                  rows: reponseArray.map((testRowData) {
                    return DataRow(cells: [
                      DataCell(Text(testRowData.fee!.toString())),
                      DataCell(Text(testRowData.discountedFee!.toString())),
                      DataCell(Text(testRowData.bookingFee!.toString()))
                    ]);
                  }).toList()),

推荐阅读