как обрабатывать данные json массив, вложенный во флаттер - PullRequest
0 голосов
/ 05 марта 2020

Я хочу получить массив данных json, вложенный в интерфейс пользователя во флаттере. У меня есть моя модель и пользовательский интерфейс, но я не понимаю, пожалуйста, посоветуйте и исправьте мой код для реализации в пользовательском интерфейсе.

это моя модель

import 'dart:convert';
import 'package:http/http.dart' as http;

MutasiRekResponse myModelFromJson(String str) => MutasiRekResponse.fromJson(json.decode(str));
String myModelToJson(MutasiRekResponse data) => json.encode(data.toJson());

class MutasiRekResponse {
    String responseCode;
    String responseMessage;
    String date;
    String time;
    String accNumber;
    String startDate;
    String endDate;
    List<Content> content;

    MutasiRekResponse({
        this.responseCode,
        this.responseMessage,
        this.date,
        this.time,
        this.accNumber,
        this.startDate,
        this.endDate,
        this.content,
    });

    factory MutasiRekResponse.fromJson(Map<String, dynamic> json) => MutasiRekResponse(
        responseCode: json["responseCode"],
        responseMessage: json["responseMessage"],
        date: json["date"],
        time: json["time"],
        accNumber: json['accNumber'],
        content: List<Content>.from(json["content"].map((x) => Content.fromJson(x))),
    );

    Map<String, dynamic> toJson() => {
        "responseCode": responseCode,
        "responseMessage": responseMessage,
        "date": date,
        "time": time,
        "accNumber": accNumber,
        "content": List<dynamic>.from(content.map((x) => x.toJson())),
    };
}

class Content {
    String postingDate;
    String valueDate;
    String inputDate;
    String inputTime;
    String desc;
    String noReff;
    String amount;
    String balance;

    Content({
        this.postingDate,
        this.valueDate,
        this.inputDate,
        this.inputTime,
        this.desc,
        this.noReff,
        this.amount,
        this.balance,
    });

    factory Content.fromJson(Map<String, dynamic> json) => Content(
        postingDate: json["postingDate"],
        valueDate: json["valueDate"],
        inputDate: json["inputDate"],
        inputTime: json["inputTime"],
        desc: json["desc"],
        noReff: json["noReff"],
        amount: json["amount"],
        balance: json["balance"],
    );

    Map<String, dynamic> toJson() => {
        "postingDate": postingDate,
        "valueDate": valueDate,
        "inputDate": inputDate,
        "inputTime": inputTime,
        "desc": desc,
        "noReff": noReff,
        "amount": amount,
        "balance": balance,
    };

  static Future<MutasiRekResponse> getMutasiDetails(String accNumber, String startDate, String endDate) async {
  String apiURL ="urlAPI";
    String username = "username";
    String password = "password";

    var bytes = utf8.encode("$username:$password");
    var credentials = base64.encode(bytes);
    var headers = {
      "Content-Type": "application/json",
      "Authorization": "Basic $credentials"
    };

  var params = Map<String, dynamic>();
  params['accNumber'] = accNumber;
  params['startDate'] = startDate;
  params['endDate'] = endDate;

  http.Response apiResult =
      await http.post(apiURL, body: params, headers: headers);
  if (apiResult.statusCode == 200) {
    return MutasiRekResponse.fromJson(json.decode(apiResult.body));
  } else {
    throw Exception('failed to load data');
  }
}
}

этот интерфейс пользовательского интерфейса

import 'package:myfolder/models/riwayatTrx_mdl.dart';
import 'package:flutter/material.dart';

class RiwayatTransaksi extends StatefulWidget {
  @override
  RiwayatTransaksiState createState() => RiwayatTransaksiState();
}

class RiwayatTransaksiState extends State<RiwayatTransaksi> {
  RiwayatTrxResult riwayatTrxResult;
@override
  void initState() {
    RiwayatTrxResult.connectToAPI("0002100000291", "", "").then((value) {
      riwayatTrxResult = value;
      setState(() {});
    });
    super.initState();
  }

  Widget build(BuildContext context) {
    return new SafeArea(
        child: new Scaffold(
      backgroundColor: Color(0xFFF4F4F4),
      appBar: AppBar(
        title: const Text('Riwayat'),
        ),
      body: Container(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            Padding(
              padding:
                  const EdgeInsets.symmetric(vertical: 20.0, horizontal: 16.0),
              child: Text(
                'Riwayat Transaksi',
                style: TextStyle(fontWeight: FontWeight.w700, fontSize: 20.0),
              ),
            ),
            _historyWidget(riwayatTrxResult),
          ],
        ),
      ),
     ),
   );
  }

  //HOW I DO CALL METHOD FOR LOOP
  Widget _historyWidget(RiwayatTrxResult riwayatTrxResult) {
    return Container(
      height: 100.0,
      margin: EdgeInsets.only(bottom: 16.0, left: 16.0, right: 16.0),
      child: Card(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Row(
            children: <Widget>[

                    ],
                  ),
                ),
              )
    );
  }  
}

API JSON Ответ

{
  "responseCode": "0000",
  "responseMessage": "Success",
  "date": "20200302",
  "time": "170248",
  "branchCode": "0000",
  "branchName": "BRANCH ONE",
  "accNumber": "0002100000291",
  "name": "MYNAME",
  "address": "jl wr supratman",
  "city": "Kab Kota Lainnya Bali",
  "postalCode": "10110",
  "totalTrx": "5",
  "content": [
    {
      "postingDate": "20191203",
      "valueDate": "20191203",
      "inputDate": "20191203",
      "inputTime": "214808",
      "desc": "BUNGA DEPOSITO JATUH TEMPO",
      "noReff": "B2100000000026",
      "amount": "+20712,33",
      "balance": "+6971357445,15"
    },
    {
      "postingDate": "20191203",
      "valueDate": "20191203",
      "inputDate": "20191203",
      "inputTime": "214809",
      "desc": "BUNGA DEPOSITO JATUH TEMPO",
      "noReff": "B2100000000033",
      "amount": "+13808,22",
      "balance": "+6971371253,37"
    },
  ]
}

как вызывать метод и обрабатывать извлечение данных в пользовательском интерфейсе, но я не понимаю, пожалуйста, совет и исправьте мой код для реализации в пользовательском интерфейсе.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...