初学Dart开发Flutter图片列表视图功能 附代码求问题解答

我正在使用Dart开发搭载图片列表视图功能的应用，作为Dart初学者，目前还在学习Dart语法及相关开发知识，项目中共创建了四个文件：

• main.dart
• app.dart
• image_list.dart
• image_model.dart

相关参考截图：

以下是各文件的对应代码，希望能得到各位开发者的帮助，在此先行致谢。

image_model.dart 代码 #

class ImageModel {
  int id;
  String url;
  String title;
  ImageModel(this.id, this.url, this.title);

  ImageModel.fromJson(Map<String, dynamic> parsedJson)
    :id = parsedJson['id'],
    url = parsedJson['url'],
    title = parsedJson['title'];  
}

image_list.dart 代码 #

import 'package:flutter/material.dart';
import '../models/image_model.dart';

class ImageList extends StatelessWidget {
  final List<ImageModel> images;

  ImageList(this.images);

  Widget build(context) {
    return ListView.builder(
        itemCount: images.length,
        itemBuilder: (context, int index) {
          return Text(images[index].url);
        },
      );
  }
}

app.dart 部分代码 #

class AppState extends State<App> {
  int counter = 0;
  List<ImageModel> images = [];

  void fetchImage() async {
    counter++;
    String url = "https://jsonplaceholder.typicode.com/photos/$counter";
    var response = await http.post(Uri.parse(url));
    var image_model = ImageModel.fromJson(json.decode(response.body));

    setState(() {
      images.add(image_model);
    });
  }

内容的提问来源于stack exchange，提问作者Rushi Ch