前端之家

  1. 首页
  2. 问答

如何创建数组列表类并在Flutter中获取数据

• 问答

我试图将一个类提供程序构建为数组列表，以便从API中获取数据，但是我找不到足够的方法来获取数据。我一直在不断出错。而且我无法弄清楚如何用类值列出数组。

这是API中代码的外观（将更改实际值只是为了显示示例）：

{
    "listProduct": [
        {
            "id": 127,"title": "String","Date": "2019-10-31T10:03:35","Price": 25.0,"category": "Jeep","brand": "مرسيدس","brandmodel": "M300","kilometer": 300.0,"modelYear": "2010","fuelType": "بنزين","gearType": "اوتوماتك","image": {
                "path": "Upload/UploadCarMain/UploadCarMain-200-200/car.jpeg","name": "car.jpeg"
            },],}

这是我的类提供者数据，应该位于数组中（该数据具有将被放入“ listProduct”中的所有值）：

class AddCar {
  int id;
  String name;
  String city;
  String country;
  String currencyT;
  double price;
  String date;
  String sponsnum;
  String category;
  String company;
  String model;
  String year;
  String engine;
  double distanceCovered;
  String transmission;
  String oilT;
  String outColor;
  String inColor;
  String description;
  File image;
  PlaceLocation location;
  bool isFavorite;

  AddCar({
    this.id,this.name,this.city,this.country,this.currencyT,this.price,this.date,this.sponsnum,this.category,this.company,this.model,this.year,this.engine,this.distanceCovered,this.transmission,this.oilT,this.outColor,this.inColor,this.description,this.image,this.location,this.isFavorite = false,});
}

这是我的获取代码（这些是我需要为显示的当前代码获取的值）：

 Future<void> fetchAndSetCars() async {
    const url =
        'My link';

      final response = await http.get(url);
      final extractedData = json.decode(response.body) as Map<String,dynamic>;
      List<AddCar> loadedCars = [];

      extractedData.forEach((carId,carData) {
        loadedCars.add(AddCar(
          id: int.parse(carId),name: carData['Title'],currencyT: carData['gearType'],price: carData['Price'],date: carData['Date'],model: carData['brandmodel'],year: carData['modelYear'],distanceCovered: carData['kilometer'],transmission: carData['gearType'],oilT: carData['fuelType'],image: File(carData['image']),));
      });
      _cars = loadedCars;
      print(json.decode(response.body));
      notifyListeners();
  }

在这里显示我的提取代码：

class CarArea extends StatefulWidget {
  @override
  _CarAreaState createState() => _CarAreaState();
}

class _CarAreaState extends State<CarArea> {
  var _isInit = true;

  @override
  void didChangeDependencies() {
    if (_isInit) {
      Provider.of<Cars>(context).fetchAndSetCars();
    }
    _isInit = false;
    super.didChangeDependencies();
  }

  @override
  Widget build(BuildContext context) {
    final carsData = Provider.of<Cars>(context);
    final car = carsData.cars;
    return car.isEmpty
        ? Padding(
            padding: EdgeInsets.all(15.0),child: Center(
                child: Text(
              'no cars available',style: TextStyle(
                fontFamily: ArabicFonts.Tajawal,fontWeight: FontWeight.bold,package: 'google_fonts_arabic',),)))
        : car.length < 2
            ? ListView.builder(
                physics: NeverScrollableScrollPhysics(),itemCount: car.length = 1,shrinkWrap: true,itemBuilder: (ctx,i) => CarItem(
                  car[i].id,car[i].image,car[i].name,car[i].model,car[i].currencyT,car[i].price,car[i].distanceCovered,car[i].transmission,car[i].oilT,car[i].year,car[i].date,)
            : ListView.builder(
                physics: NeverScrollableScrollPhysics(),itemCount: car.length = 2,);
  }
}

还有将我的CarItem显示在用户界面上的代码：

class CarItem extends StatelessWidget {
  final int id;
  final File image;
  final String name;
  final String model;
  final String currencyT;
  final double price;
  final double distanceCovered;
  final String transmission;
  final String oilT;
  final String year;
  final String date;

  CarItem(
    this.id,);

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        border: Border(
          bottom: BorderSide(color: Theme.of(context).primaryColor,width: 2.0),child: Column(
        children: <Widget>[
          Container(
            decoration: BoxDecoration(
              color: Color.fromARGB(255,245,245),child: Padding(
              padding: const EdgeInsets.fromLTRB(17.0,4.0,17.0,4.0),child: Row(
                textDirection: TextDirection.rtl,mainAxisAlignment: MainAxisAlignment.spaceBetween,children: <Widget>[
                  Container(
                    child: Row(
                      textDirection: TextDirection.rtl,children: <Widget>[
                        Padding(
                          padding: const EdgeInsets.fromLTRB(5.0,0),child: Icon(
                            MyFlutterApp.cars,Text(
                          AppLocalizations.of(context).itemListCar,Container(
                    child: Row(
                      children: <Widget>[
                        Text(
                          date.toString(),Padding(
                          padding: const EdgeInsets.fromLTRB(0,5.0,child: Icon(
                            MyFlutterApp.history,Row(
            mainAxisAlignment: MainAxisAlignment.end,crossAxisAlignment: CrossAxisAlignment.center,children: <Widget>[
              Container(
                width: MediaQuery.of(context).size.width * 0.35,height: MediaQuery.of(context).size.width * 0.35,child: GestureDetector(
                  child: image == null
                      ? Container(
                        decoration: BoxDecoration(
                          color: Colors.grey[200],padding: EdgeInsets.all(6),child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[
                              Text(
                                'No Images provided',textAlign: TextAlign.center,)
                      : Image.file(
                          image,fit: BoxFit.fill,onTap: () {
                    Navigator.of(context).pushNamed(
                      MyCarDetails.routeName,arguments: id,);
                  },Container(
                width: MediaQuery.of(context).size.width * 0.65,margin: EdgeInsets.all(0),padding: const EdgeInsets.fromLTRB(22.0,22.0,child: Column(
                  children: <Widget>[
                    Container(
                        width: double.infinity,padding: EdgeInsets.only(
                          bottom: 5.8,top: 0,child: Text(
                          name,)),Container(
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,children: <Widget>[
                          Expanded(
                            child: Text(
                              model,Text(
                            currencyT + price.toStringAsFixed(1),crossAxisAlignment: CrossAxisAlignment.end,children: <Widget>[
                          Tab(
                            icon: Icon(
                              MyFlutterApp.km,child: Text(
                              distanceCovered.toStringAsFixed(0) + ' KM',Tab(
                            icon: Icon(
                              MyFlutterApp.motion_vector,child: Text(
                              transmission,Tab(
                            icon: Icon(
                              MyFlutterApp.fuel_type,child: Text(
                              oilT,Tab(
                            icon: Icon(
                              MyFlutterApp.general_model,child: Text(
                              year,);
  }
}

这是我在堆栈跟踪中遇到的错误：

E/flutter (29729): [ERROR:flutter/lib/ui/ui_dart_state.cc(148)] Unhandled Exception: FormatException: Invalid radix-10 number (at character 1)
E/flutter (29729): listProduct
E/flutter (29729): ^
E/flutter (29729):
E/flutter (29729): #0      int._throwFormatException  (dart:core-patch/integers_patch.dart:131:5)
E/flutter (29729): #1      int._parseRadix  (dart:core-patch/integers_patch.dart:142:16)
E/flutter (29729): #2      int._parse  (dart:core-patch/integers_patch.dart:100:12)
E/flutter (29729): #3      int.parse  (dart:core-patch/integers_patch.dart:63:12)
E/flutter (29729): #4      Cars.fetchAndSetCars.<anonymous closure> 
package:flutter_app/providers/car_provider.dart:107
E/flutter (29729): #5      _LinkedHashMapMixin.forEach  (dart:collection-patch/compact_hash.dart:377:8)
E/flutter (29729): #6      Cars.fetchAndSetCars 
package:flutter_app/providers/car_provider.dart:105
E/flutter (29729): <asynchronous suspension>
E/flutter (29729): #7      _CarAreaState.didChangeDependencies
E/flutter (29729): #8      StatefulElement._firstBuild 
package:flutter/…/widgets/framework.dart:4086
E/flutter (29729): #9      ComponentElement.mount 
package:flutter/…/widgets/framework.dart:3919
E/flutter (29729): #10     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #11     Element.updateChild 
package:flutter/…/widgets/framework.dart:2904
E/flutter (29729): #12     ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:3961
E/flutter (29729): #13     Element.rebuild 
package:flutter/…/widgets/framework.dart:3738
E/flutter (29729): #14     ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:3924
E/flutter (29729): #15     ComponentElement.mount 
package:flutter/…/widgets/framework.dart:3919
E/flutter (29729): #16     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #17     Element.updateChild
E/flutter (29729): #18     ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:3961
E/flutter (29729): #19     Element.rebuild 
package:flutter/…/widgets/framework.dart:3738
E/flutter (29729): #20     ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:3924
E/flutter (29729): #21     StatefulElement._firstBuild 
package:flutter/…/widgets/framework.dart:4088
E/flutter (29729): #22     ComponentElement.mount 
package:flutter/…/widgets/framework.dart:3919
E/flutter (29729): #23     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #24     MultiChildRenderObjectElement.mount 
package:flutter/…/widgets/framework.dart:5233
E/flutter (29729): #25     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #26     Element.updateChild 
package:flutter/…/widgets/framework.dart:2904
E/flutter (29729): #27     SingleChildRenderObjectElement.mount
E/flutter (29729): #28     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #29     Element.updateChild 
package:flutter/…/widgets/framework.dart:2904
E/flutter (29729): #30     SingleChildRenderObjectElement.mount 
package:flutter/…/widgets/framework.dart:5127
E/flutter (29729): #31     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #32     Element.updateChild 
package:flutter/…/widgets/framework.dart:2904
E/flutter (29729): #33     ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:3961
E/flutter (29729): #34     Element.rebuild 
package:flutter/…/widgets/framework.dart:3738
E/flutter (29729): #35     ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:3924
E/flutter (29729): #36     ComponentElement.mount 
package:flutter/…/widgets/framework.dart:3919
E/flutter (29729): #37     Element.inflateWidget
E/flutter (29729): #38     Element.updateChild 
package:flutter/…/widgets/framework.dart:2904
E/flutter (29729): #39     ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:3961
E/flutter (29729): #40     Element.rebuild 
package:flutter/…/widgets/framework.dart:3738
E/flutter (29729): #41     ComponentElement._firstBuild 
package:flutter/…/widgets/framework.dart:3924
E/flutter (29729): #42     ComponentElement.mount 
package:flutter/…/widgets/framework.dart:3919
E/flutter (29729): #43     ParentDataElement.mount 
package:flutter/…/widgets/framework.dart:4314
E/flutter (29729): #44     Element.inflateWidget 
package:flutter/…/widgets/framework.dart:3101
E/flutter (29729): #45     Element.updateChild 
package:flutter/…/widgets/framework.dart:2904
E/flutter (29729): #46     Componen

印刷品给了我这个

{listProduct: [{id: 127,Title: car -en,Date: 2019-10-31T10:03:35,Price: 25.0,category: car child 2,categoryId: 8,status: 1,brandId: 1,brand: mercedes,brandmodelId: 6,brandmodel: M300,kilometer: 300.0,modelYearId: 2,modelYear: 2010,fuelType: benz,carFeatureFuelId: 3,gearType: automatic,carFeatureGearId: 2,image: {path: Upload/UploadCarMain/UploadCarMain-200-200/carCar127.jpeg,name: carCar127.jpeg},vendorId: 2},{id: 44,Title: null,Date: 2019-10-26T09:16:23.0265211,Price: 3454.0,category: car child 1,categoryId: 7,brandId: 2,brand: BM,brandmodelId: 7,brandmodel: BM X5,kilometer: 345.0,fuelType: dezil,carFeatureFuelId: 4,gearType: normal,carFeatureGearId: 1,image: {path: Upload/UploadCarMain/UploadCarMain-200-200/1Car44.jpg,name: 1Car44.jpg},vendorId: 1},{id: 43,Date: 2019-10-25T09:40:46.4631028,

打印已加载的汽车后：

[{id: 127,brandmodel
johnny_zhengyi 回答：如何创建数组列表类并在Flutter中获取数据

首先，您必须以此访问listProduct。

final response = await http.get(url);
final extractedData = json.decode(response.body);
List loadedCars = extractedData['listProduct'];
for(var i in loadedCars) {
    _cars.add(AddCar(
      id: i["id"],name: i['Title'],currencyT: i['gearType'],price: i['Price'],date: i['Date'],model: i['brandModel'],year: i['modelYear'],distanceCovered: i['kilometer'],transmission: i['gearType'],oilT: i['fuelType'],image: File(i['image']),));
}

这样，您将创建一个数据数组列表，并且在视图中您必须访问 该数组列表_cars。

希望它会对您有所帮助。

arraylisterror-handlingfetch-apiflutter
本文链接：https://www.f2er.com/3161856.html

大家都在问