Json 如何使用可观测方法处理颤振GetX中复杂的API数据响应

我是Flatter和GetX软件包领域的新手，我正在尝试使用Laravel作为API服务创建一个简单的应用程序，我正在以JSON格式从API发送响应，我正在使用Laravel资源API，因此它在响应中发送一些额外的元数据，我已经在我的应用程序中创建了服务模型和控制器颤振应用程序但当我在控制器中初始化一个可观察变量时，它抛出了很多错误。我尝试了所有方法，但当我仅从API发送数据列表时，它工作正常，因为我必须在控制器中定义

列表。obs

，但当我根据需要从API发送正确响应时，问题发生了

这是我从API获得的JSON响应数据

{
“数据”：[
{
“id”：1，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：2，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：3，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：4，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：5，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：6，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：7，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：8，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：9，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：10，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：11，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：12，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：13，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：14，
“说明”：“购买的鼠标sa”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
},
{
“id”：15，
“说明”：“购买的鼠标”，
“金额”：“1200”，
“类型”：“费用”，
“用户id”：1，
“created_at”：空，
“更新位置”：空
}
],
“链接”：{
“第一”：http://localhost:8000/api/transactions?page=1",
“最后”：http://localhost:8000/api/transactions?page=2",
“prev”：空，
“下一步”：http://localhost:8000/api/transactions?page=2"
},
“元”：{
“当前页面”：1，
“从”：1，
“最后一页”：2，
“链接”：[
{
“url”：空，
“标签”：“先前”，
“活动”：错误
},
{
“url”：”http://localhost:8000/api/transactions?page=1",
“标签”：1，
“活动”：真
},
{
“url”：”http://localhost:8000/api/transactions?page=2",
“标签”：2，
“活动”：错误
},
{
“url”：”http://localhost:8000/api/transactions?page=2",
“标签”：“下一步”，
“活动”：错误
}
],
“路径”：http://localhost:8000/api/transactions",
“每页”：15，
“至”：15，
“总数”：16
}
}

这是我的服务课

导入'dart:convert'；
将“package:http/http.dart”导入为http；
导入“package:m_budget/models/transaction.dart”；
类事务服务{
静态var client=http.client（）；
静态未来fetchTransactions（）异步{
var res=wait client.get（“http://10.0.2.2:8000/api/transactions");
如果（res.statusCode==200）{
返回transactionFromJson（r
class ItemModel {
  int id;
  String description;
  String amount;
  String type;
  int userId;
  DateTime createdAt;
  DateTime updatedAt;

  ItemModel.fromJson(Map<String, dynamic> data) {
    id = data['id'];
    description = data['description'];
    amount = data['amount'];
    type = data['type'];
    userId = data['userId'];
    if (data['created_at'] != null) createdAt = DateTime.parse(data['created_at']);
    if (data['updated_at'] != null) updatedAt = DateTime.parse(data['updated_at']);
  }
}

class PageLinksModel {
  String first, last, prev, next;

  PageLinksModel.fromJson(Map<String, dynamic> data) {
    first = data['first'];
    last = data['last'];
    prev = data['prev'];
    next = data['next'];
  }
}

class PagesStatusModel {
  int currentPage, from, lastPage;
  var links = List<PageInfoModel>();
  String path;
  int perPage, to, total;

  PagesStatusModel.fromJson(Map<String, dynamic> data) {
    currentPage = data['current_page'];
    from = data['from'];
    lastPage = data['last_page'];
    (data['links'] as List).forEach((e) => links.add(PageInfoModel.fromJson(e)));
    path = data['path'];
    perPage = data['per_page'];
    to = data['to'];
    total = data['total'];
  }
}

class PageInfoModel {
  String url; 
  dynamic label;
  bool active;

  PageInfoModel.fromJson(Map<String, dynamic> data) {
    url = data['url'];
    label = data['label'];
    active = data['active'];
  }
}

import 'package:getx_api/models/pages_status_model.dart';

class TransactionModel {
  var data = List<ItemModel>();
  PageLinksModel links;
  PagesStatusModel meta;

  TransactionModel.fromJson(Map<String, dynamic> source) {
    (source['data'] as List).forEach((e) => data.add(ItemModel.fromJson(e)));
    links = PageLinksModel.fromJson(source['links']);
    meta = PagesStatusModel.fromJson(source['meta']);
  }
}

import 'dart:convert';

import 'package:getx_api/src/shared/transactions_data.dart';
import 'package:http/http.dart' as http;

class NetService {
  static Future fetchJsonData(String url) {
    return
      http.get(url)
        .then((response) => response?.statusCode == 200 ? jsonDecode(response.body) : null)
        .catchError((err) => print(err));
  }

  static Future fetchLocalJsonData() async {
    await Future.delayed(Duration(seconds: 3));

    return jsonDecode(transactionData) as Map<String, dynamic>;
  }
}

import 'package:get/get.dart';
import 'package:getx_api/models/transaction_model.dart';
import 'package:getx_api/services/net_service.dart';


const _serverUrl = 'http://10.0.2.2:8000/api/transactions';

class TransactionController extends GetxController {
  var _trx;
  var _dataAvailable = false.obs;

  @override
  void onInit() {
    super.onInit();
    fetchTransactions();
  }

  bool get dataAvailable => _dataAvailable.value;
  TransactionModel get trx => _trx;

  Future<void> fetchTransactions() {
    // return NetService.fetchJsonData(_serverUrl)
    return NetService.fetchLocalJsonData()
      .then((response) {
        if (response != null) _trx = TransactionModel.fromJson(response);
      })
      .catchError((err) => print('Error!!!!! : $err'))
      .whenComplete(() => _dataAvailable.value = _trx != null);
  }
}

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getx_api/src/controllers/transaction_controller.dart';


class HomePage extends StatelessWidget {
  /* ---------------------------------------------------------------------------- */
  const HomePage({Key key}) : super(key: key);
  /* ---------------------------------------------------------------------------- */
  @override
  Widget build(BuildContext context) {
    final obj = Get.put(TransactionController());

    return Scaffold(
      appBar: buildAppBar(),
      body: Obx(() => obj.dataAvailable
        ? Text(obj.trx.toString())
        : Text('... waiting ...')),
    );
  }
  /* ---------------------------------------------------------------------------- */
  AppBar buildAppBar() {
    return AppBar(
      title: Text('Hi!'),
      centerTitle: true,
    );
  }
}

const transactionData = '''
{
    "data": [
    ....
    }
}
''';