Преобразуйте json repsonse в строки и поместите его в структуру

Question

Я делаю мобильное приложение для покупок

Я хочу заменить статические данные данными из json online и поместить эти данные в структуру, чтобы показать их с помощью Gridview и использовать их где-нибудь еще так что это структура:

    class Product {

  String _urlToImage;
  String _about;
  String _title;
  double _price;
  double _weight;
  int _id;


  Product(this._urlToImage, this._title, this._price, this._weight, this._id){
    _about = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.";
  }

  double get weight => _weight;

  double get price => _price;

  String get title => _title;

  String get urlToImage => _urlToImage;

  int get id => _id;

  String get about => _about;


}
```

и это локальные данные внутри структуры

  class ProductsRepository{

List<Product>  fetchAllProducts() {

return [
  new Product("assets/images/spelt_noodles.png", "Biona Organic Spelt Noodles", 2.99, 250, 0),
  new Product("assets/images/spelt_italian.png", "Biona Organic Spelt Fusili Brown", 2.35, 500, 1),
  new Product("assets/images/spelt_spaghetti.png", "Biona Organic Whole Spelt Spaghetti", 2.35, 500, 2),
  new Product("assets/images/spelt_tagliatelle.png", "Biona Organic Spelt Spinach Artisan Tagliatelle", 1.99, 250, 3),
  new Product("assets/images/spelt_penne.png", "Biona Organic Whole Spelt Penne", 2.35, 500, 4),
  new Product("assets/images/spelt_tagliatelle.png", "Biona Organic Spelt Spinach Artisan Tagliatelle", 1.99, 250, 5),
  new Product("assets/images/spelt_fusilli.png", "Biona Organic Spelt Fusilli Tricolore", 1.99, 250, 6),
];}

Я пытался

  _fetchData() async {

    final response =
    await http.get("https://jsonplaceholder.typicode.com/photos");
        if (response.statusCode == 200) {
          list = json.decode(utf8.decode(response.bodyBytes)) as List;

    } else {
    throw Exception('Failed to load photos');
    }
  }

точно так же, как эта концепция, но данные json должны быть в структуре Product ()

List data;

Future<String> getData() async {
  var response = await http.get(
      Uri.encodeFull("https://aflam4app.de/JSON/" + widget.thisJson +".json"),
      headers: {
        'Content-Type': 'application/json',
        "Accept": "application/json"
      }
  );

  this.setState(() {
    data = json.decode(utf8.decode(response.bodyBytes));
  });
  return "Success!";
}


@override
void initState() {
  super.initState();
  this.getData();
}

@override
Widget build(BuildContext context) {
  return GridView.builder(
      itemCount: data == null ? 0 : data.length,
      gridDelegate:
      new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
      itemBuilder: (BuildContext context, int index) {
        return Padding(
          padding: const EdgeInsets.all(4.0),
          child: Single_prod(
            prod_name: data[index]['name'],
            prod_pricture: data[index]['picture'],
            prod_link: data[index]['link'],
            prod_description: data[index]['description'],
            prod_type: data[index]['type'],
          ),
        );
      });
}
}

class Single_prod extends StatelessWidget {
final prod_name;
final prod_pricture;
final prod_link;
final prod_description;
final prod_type;

Single_prod({
  this.prod_name,
  this.prod_pricture,
  this.prod_link,
  this.prod_description,
  this.prod_type,
});

вот мой файл json:

[
    {
        "urlToImage": "assets/images/spelt_noodles.png",
        "title": "Biona Organic Spelt Noodles",
        "price": 2.99,
        "weight": 250,
        "id": 1,
        "created_at": "2019-07-07 10:44:53",
        "updated_at": "2019-07-07 10:44:53"
    },
    {
        "urlToImage": "assets/images/spelt_noodles.png",
        "title": "Biona Organic Spelt Noodles",
        "price": 2.99,
        "weight": 250,
        "id": 2,
        "created_at": "2019-07-07 10:44:53",
        "updated_at": "2019-07-07 10:44:53"
    },
    {
        "urlToImage": "assets/images/spelt_noodles.png",
        "title": "Biona Organic Spelt Noodles",
        "price": 2.99,
        "weight": 250,
        "id": 3,
        "created_at": "2019-07-07 10:44:53",
        "updated_at": "2019-07-07 10:44:53"
    },


]

Answer 1

Так вы можете анализировать данные

    List<Product> list = new List<Product>();
    var map= json.decode(response.body);

    for(var item in map){
      Product product = new Product.fromJson(item); //making an assumption how your json looks
      list.add(product); //user a Futurebuilder to create your GridView
    }

Так вы можете определить класс вашей модели

    Product fromJson(Map<String, dynamic> json){
      Product product = new Product(
        _urlToImage = json['urlToImage'] as String;
        _about = json['about'] as String;
        _title = json['title'] as String;
        _price = json['price'] as double;
        _weight = json['weight'] as double;
        _id = json['id'] as int;
      );
      return product;
    }

    ...

Здесь Пример Gridview

Answer 2

Еще один способ сделать.

import 'dart:convert';

import 'json_objects.dart';

void main() {
  var json = (jsonDecode(body) as List).cast<Map<String, dynamic>>();
  var list = json.map<Response1>((e) => Response1.fromJson(e)).toList();
  for (var item in list) {
    print(item.id);
    print(item.title);
  }
}

final body = '''
[
  {
    "urlToImage": "assets/images/spelt_noodles.png",
    "title": "Biona Organic Spelt Noodles",
    "price": 2.99,
    "weight": 250,
    "id": 1,
    "created_at": "2019-07-07 10:44:53",
    "updated_at": "2019-07-07 10:44:53"
  },
  {
    "urlToImage": "assets/images/spelt_noodles.png",
    "title": "Biona Organic Spelt Noodles",
    "price": 2.99,
    "weight": 250,
    "id": 2,
    "created_at": "2019-07-07 10:44:53",
    "updated_at": "2019-07-07 10:44:53"
  },
  {
    "urlToImage": "assets/images/spelt_noodles.png",
    "title": "Biona Organic Spelt Noodles",
    "price": 2.99,
    "weight": 250,
    "id": 3,
    "created_at": "2019-07-07 10:44:53",
    "updated_at": "2019-07-07 10:44:53"
  }
]''';

Результат:

1
Biona Organic Spelt Noodles
2
Biona Organic Spelt Noodles
3
Biona Organic Spelt Noodles

Модели данных JSON (безопасные, с правильным преобразованием данных).

class Response1 {
  final String createdAt;
  final int id;
  final double price;
  final String title;
  final String updatedAt;
  final String urlToImage;
  final int weight;

  Response1(
      {this.createdAt,
      this.id,
      this.price,
      this.title,
      this.updatedAt,
      this.urlToImage,
      this.weight});

  factory Response1.fromJson(Map<String, dynamic> json) {
    return Response1(
      createdAt: json['created_at'] as String,
      id: json['id'] as int,
      price: _toDouble(json['price']),
      title: json['title'] as String,
      updatedAt: json['updated_at'] as String,
      urlToImage: json['urlToImage'] as String,
      weight: json['weight'] as int,
    );
  }

  Map<String, dynamic> toJson() {
    return {
      'created_at': createdAt,
      'id': id,
      'price': price,
      'title': title,
      'updated_at': updatedAt,
      'urlToImage': urlToImage,
      'weight': weight,
    };
  }
}

double _toDouble(data) {
  if (data == null) {
    return null;
  }
  if (data is int) {
    return data.toDouble();
  }
  return data as double;
}

/*
Response1:
  "urlToImage": String
  "title": String
  "price": double
  "weight": int
  "id": int
  "created_at": String
  "updated_at": String
*/