使用 Flutter 从数据库中构建列表获取

Posted 2023-02-23

【中文标题】使用 Flutter 从数据库中构建列表获取

【英文标题】：Build list fetch from database using Flutter

【发布时间】：2020-11-05 21:52:20

【问题描述】：

我正在构建一个项目，我正在尝试发布和获取数据。我正在这样做，首先，我登录应用程序并使用 SharedPreferences 保存 id 值，然后将此 id 值发布到 URL。在我发布到这个 URL 之后，我想在我的屏幕上显示数据。但它给了我错误，我将在下面添加代码和错误：

class ServisProfil extends StatefulWidget 
  @override
  _ServisProfilState createState() => _ServisProfilState();


BekliyorModel bekliyorModelFromJson(String str) => BekliyorModel.fromJson(json.decode(str));

String bekliyorModelToJson(BekliyorModel data) => json.encode(data.toJson());

class BekliyorModel 
  int id;
  int ihaleId;
  String plakaNo;

  BekliyorModel(
    this.id,
    this.ihaleId,
    this.plakaNo,
  );

  factory BekliyorModel.fromJson(Map<String, dynamic> json) => BekliyorModel(
        id: json["id"],
        ihaleId: json["ihale_id"],
        plakaNo: json["plaka_no"],

      );

  Map<String, dynamic> toJson() => 
        "id": id,
        "ihale_id": ihaleId,
        "plaka_no": plakaNo,

      ;


Future<BekliyorModel> postAndFetchBekliyorDatas(
  String servisIdTitle,
  String kategoriTitle,
) async 
  final String apiUrl =
      "https://www.esr.com.tr/dart-login.php";

  final response = await http.post(apiUrl, body: 
    "kategori": kategoriTitle,
    "servis_id": servisIdTitle,
  );

  if (response.statusCode == 200) 
    final String responseString = response.body;

    return bekliyorModelFromJson(responseString);
   else 
    return null;
  


class _ServisProfilState extends State<ServisProfil> 
  BekliyorModel _id;
  BekliyorModel _ihaleId;
  BekliyorModel _plakaNo;

  Widget _buildBekliyor() 
    return Container(
      height: 60,
      child: RaisedButton(
          highlightElevation: 0,
          splashColor: Colors.transparent,
          elevation: 0,
          color: Colors.white,
          child: Container(
            alignment: Alignment.centerLeft,
            child: Text(
              'Bekliyor/Sonuçlanan',
              style: TextStyle(fontSize: 18, color: Colors.black),
            ),
          ),
          onPressed: () async 
            final prefs = await SharedPreferences.getInstance();
            final key = 'servis_id';



            final String servisIdTitle = prefs.getString(key).toString();
            final String kategoriTitle = 3.toString();

            final BekliyorModel user = await postAndFetchBekliyorDatas(
              servisIdTitle,
              kategoriTitle,
            );

            setState(() 
              _id = user;
              _ihaleId = user;
              _plakaNo = user;

            );

            _sendDataToBekliyor(context);

            print(servisIdTitle.toString());
          ),
      decoration: BoxDecoration(
        border: Border(
          bottom: BorderSide(
            width: 1,
            color: Colors.black12,
          ),
        ),
      ),
    );
  

  void _sendDataToBekliyor(BuildContext context) 
    int idSend = _id.id;
    int ihaleIdSend = _ihaleId.ihaleId;
    String plakaNoSend = _plakaNo.plakaNo;

    Navigator.of(context).push(
      CupertinoPageRoute(
        builder: (context) => Bekliyor(
          idSend: idSend,
          ihaleIdSend: ihaleIdSend,
          plakaNoSend: plakaNoSend,

        ),
      ),
    );
  

  @override
  Widget build(BuildContext context) 
    return _buildBekliyor();
  

这是我想查看数据的屏幕：

class Bekliyor extends StatelessWidget 
  final int idSend;
  final int ihaleIdSend;
  final String plakaNoSend;



  Bekliyor(
    this.idSend,
    this.ihaleIdSend,
    this.plakaNoSend,
  );


Widget _buildBody() 
    return ListView.builder(
      itemCount: //WHAT I WILL WRITE,
      itemBuilder: (context, index) 
        return Container(
          margin: EdgeInsets.all(10),
          child: MaterialButton(
            splashColor: Colors.transparent,
            highlightColor: Colors.transparent,
            onPressed: () => Navigator.of(context).push(
              CupertinoPageRoute(
                builder: (context) => BekliyorDetay(),
              ),
            ),
            child: Column(
              children: <Widget>[
                Center(
                  child: Text(plakaNoSend.toString()),
                ),
                Center(
                  child: Text(ihaleNoSend.toString()),
                ),
                Center(
                  child: Text(idSend.toString()),
                ),

],
            ),
          ),
          decoration: BoxDecoration(
            color: Colors.grey[200],
            borderRadius: BorderRadius.circular(12.0),
            boxShadow: [
              BoxShadow(
                color: Colors.grey,
                offset: Offset(0.0, 1.0), //(x,y)
                blurRadius: 6.0,
              ),
            ],
            border: Border.all(width: 0.36, color: Colors.white),
          ),
        );
      ,
    );
  

 @override
  Widget build(BuildContext context) 
    return Scaffold(
      backgroundColor: Colors.white,
      body: _buildBody(),
    );
  

并给我这个错误：

[VERBOSE-2:ui_dart_state.cc(166)] 未处理的异常：“List”类型不是“Map”类型的子类型

【问题讨论】：

能否在DartPad上转载？

它给了我同样的错误，我认为错误在这里：BekliyorModel bekliyorModelFromJson(String str) => BekliyorModel.fromJson(json.decode(str)); String bekliyorModelToJson(BekliyorModel data) => json.encode(data.toJson());

您必须将其作为gist 上传，然后您可以复制该id 并将其放入&id=id 之类的URL 中。

我该怎么做？我想，如果我尝试这样做，我必须更改很多代码，对吧？

哦，我真的错过了这是一个非常明显的语法错误，更不用说我的 cmets 关于 DartPad。

【参考方案1】：

class OverviewModal 
    int status;
    String message;
    List<OverviewData> overview;

OverviewModal(this.status, this.message, this.overview);

OverviewModal.fromJson(Map<String, dynamic> json)
  : status = json["status"],
    message = json["message"],
    overview = List.from(json["DetailList"])
        .map((item) => OverviewData.fromJson(item))
        .toList();


class OverviewData 
 String month;
 String voucherNumber;
 String voucherDate;
 String amount;

 OverviewData.fromJson(Map<String, dynamic> json)
  : month = json["month"],
    voucherNumber = json["vocher_no"],
    voucherDate = json["vocher_date"],
    amount = json["amount"];
 

在我的例子中，overview 是一种列表，DetailList 保存来自后端的列表数据，我有一种方法用于列表数据。希望您理解这一点。