【问题标题】:get data from php api n popuate flutter table从 php api 获取数据并填充颤振表
【发布时间】:2022-01-01 17:01:05
【问题描述】:

我想将 api 中的数据插入到颤振表中..

为 API 数据创建的模型类

class Model {
  Model({
    this.id,
    this.goodsRef,
    this.loyer,
    this.bnCode,
    this.loyeeNo,
    this.contactName,
    this.contactTel,
    this.bnDesc,
    this.reqStatus,
    this.eMail,
    this.comments,
    this.tender,
    this.reqDate,
    this.sscOffice,
  });

  final String id;
  final int goodsRef;
  final String loyer;
  final String bnCode;
  final int loyeeNo;
  final dynamic contactName;
  final dynamic contactTel;
  final String bnDesc;
  final String reqStatus;
  final dynamic eMail;
  final String comments;
  final List<Tender> tender;
  final DateTime reqDate;
  final dynamic sscOffice;

  factory Model.fromJson(Map<String, dynamic> json) => Model(
    id: json["\u0024id"] == null ? null : json["\u0024id"],
    goodsRef: json["goods_ref"] == null ? null : json["goods_ref"],
    loyer: json["loyer"] == null ? null : json["loyer"],
    bnCode: json["bn_code"] == null ? null : json["bn_code"],
    loyeeNo: json["loyee_no"] == null ? null : json["loyee_no"],
    contactName: json["contact_name"],
    contactTel: json["contact_tel"],
    bnDesc: json["bn_desc"] == null ? null : json["bn_desc"],
    reqStatus: json["req_status"] == null ? null : json["req_status"],
    eMail: json["e_mail"],
    comments: json["comments"] == null ? null : json["comments"],
    tender: json["tender"] == null ? null : List<Tender>.from(json["tender"].map((x) => Tender.fromJson(x))),
    reqDate: json["req_date"] == null ? null : DateTime.parse(json["req_date"]),
    sscOffice: json["ssc_office"],
  );

  Map<String, dynamic> toJson() => {
    "\u0024id": id == null ? null : id,
    "goods_ref": goodsRef == null ? null : goodsRef,
    "loyer": loyer == null ? null : loyer,
    "bn_code": bnCode == null ? null : bnCode,
    "loyee_no": loyeeNo == null ? null : loyeeNo,
    "contact_name": contactName,
    "contact_tel": contactTel,
    "bn_desc": bnDesc == null ? null : bnDesc,
    "req_status": reqStatus == null ? null : reqStatus,
    "e_mail": eMail,
    "comments": comments == null ? null : comments,
    "tender": tender == null ? null : List<dynamic>.from(tender.map((x) => x.toJson())),
    "req_date": reqDate == null ? null : reqDate.toIso8601String(),
    "ssc_office": sscOffice,
  };
}

class Tender {
  Tender({
    this.id,
    this.goodsRef,
    this.inNo,
    this.tenderNo,
    this.closingDate,
  });

  final String id;
  final int goodsRef;
  final int inNo;
  final String tenderNo;
  final String closingDate;

  factory Tender.fromJson(Map<String, dynamic> json) => Tender(
    id: json["\u0024id"] == null ? null : json["\u0024id"],
    goodsRef: json["goods_ref"] == null ? null : json["goods_ref"],
    inNo: json["in_no"] == null ? null : json["in_no"],
    tenderNo: json["tender_no"] == null ? null : json["tender_no"],
    closingDate: json["closing_date"] == null ? null : json["closing_date"],
  );

  Map<String, dynamic> toJson() => {
    "\u0024id": id == null ? null : id,
    "goods_ref": goodsRef == null ? null : goodsRef,
    "in_no": inNo == null ? null : inNo,
    "tender_no": tenderNo == null ? null : tenderNo,
    "closing_date": closingDate == null ? null : closingDate,
  };}

从 php api 获取数组的代码是 fetch() async {

    String apiurl = "";
    var response = await http.post(Uri.parse(apiurl), body: {
      'username': email //get the username text
    });

    if(response.statusCode==200) //as wish wish check your response
        {
      List<Model> model =  jsonDecode(response.body).map((item) => item).toList();
      print(model.first);
      return model;


    }
    return Table( //if data is loaded then show table
      border: TableBorder.all(width:1, color:Colors.black45),
      children: toList.map((nameone){
        return TableRow( //return table row in every loop
            children: [
              //table cells inside table row
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.sn)
              )
              ),
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.name)
              )
              ),
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.address)
              )
              ),
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.phone)
              )
              ),
            ]
        );
      }).toList(),
    );
  }

问题是收到数据后,我想用箭头中的箭头填充表格上的每一行...

当前错误消息是 NoSuchMethodError: The getter 'length' was called on null

如何修复错误并使用来自 api 的数组数据填充表

api返回的例子是

{
    "$id":"6",
    "goods_ref":60,
    "loyer":"",
    "bn_code":"",
    "loyee_no":1,
    "contact_name":null,
    "contact_tel":null,
    "bn_desc":"DEVELOP PAYROLL HR SYSTEMS",
    "req_status":"N",
    "e_mail":null,
    "comments":"",
    "tender":[
        {"$id":"7",
        "goods_ref":0,
        "in_no":1,
        "tender_no":"GENERAL",
        "closing_date":""
        },{
        "$id":"8",
        "goods_ref":0,
        "in_no":2,
        "tender_no":"GENERAL",
        "closing_date":""
        }
    ],
    "req_date":"2020-02-20T00:00:00",
    "ssc_office":null
},

【问题讨论】:

    标签: php flutter api dart


    【解决方案1】:

    有些值是空的,所以在将它分配给小部件时,如果它为空,请检查是否为它分配了一个空字符串。例如:Text(nameone.sn ?? "")

    从 api 收到数据后,您可以从中创建一个表。

    Widget myTable;
    Future<void> fetchItems() async {
        String apiurl = "";
        var response = await http.post(Uri.parse(apiurl), body: {
           'username': email //get the username text
        });
    
        if(response.statusCode==200) //as wish wish check your response
        {
           List<Model> model =  jsonDecode(response.body).map((item) => item).toList();
           setState((){
                myTable = Table( //if data is loaded then show table
             border: TableBorder.all(width:1, color:Colors.black45),
            children: model.map((nameone){
              return TableRow( //return table row in every loop
            children: [
              //table cells inside table row
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.sn ?? "")
              )
              ),
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.name ?? "")
              )
              ),
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.address ?? "")
              )
              ),
              TableCell(child: Padding(
                  padding: EdgeInsets.all(5),
                  child:Text(nameone.phone ?? "")
              )
              ),
             ]
            );
           }).toList(),
           );
           });
          }
        }
    

    【讨论】:

    • 如何将该表更改为动态...从 api 获取数据并分配给每一行 ....动态
    • 当您从api中提取数据时,将其分配给一个widget并将该widget作为主体
    猜你喜欢
    • 2021-11-03
    • 2020-10-17
    • 2020-11-17
    • 2021-12-16
    • 2020-09-01
    • 2020-10-05
    • 2021-01-26
    • 2020-01-26
    • 1970-01-01
    相关资源
    最近更新 更多