Flutter:如何从 API 中获取数据并以列表形式显示在 flutter 中?

Flutter : How to fetch data from API and show in the list form with image in flutter?

如何从 api .API 响应中获取数据如下所示。以列表形式显示,并在 flutter 中显示图像。

{
    "status": 1,
    "msg": "7 banners found",
    "data": [
        {
            "id": "14",
            "image": "https://www.sofikart.com/admin/upload/app_banner/1635945056.jpeg",
            "cat_id": "4",
            "product_id": "81",
            "url": null,
            "status": "Active",
            "ordering": "0",
            "updated": "2021-11-03 06:10:56"
        },
        {
            "id": "7",
            "image": "https://www.sofikart.com/admin/upload/app_banner/1642082634.jpeg",
            "cat_id": "4",
            "product_id": "111",
            "url": null,
            "status": "Active",
            "ordering": "1",
            "updated": "2021-10-28 04:53:26"
        }
    ] }

在这种情况下,Flutter 有一个很好的文档和示例,我很确定这会对您有所帮助。

你可以看看here

Fetching data from the internet is necessary for most apps. Luckily, Dart and Flutter provide tools, such as the http package, for this type of work.

This recipe uses the following steps:

  1. Add the http package.
  2. Make a network request using the http package.
  3. Convert the response into a custom Dart object.
  4. Fetch and display the data with Flutter.