期望类型 'ProductList' 的值，但得到类型“_Future<ProductList>”之一

Question

我正在尝试使用休息 api 数据 return 地图列表，每个地图都包含产品详细信息，因此我为产品和 productList 编码 classes fromJsom 方法已实施，然后我尝试在我的 flutter 应用程序中使用 list.generate 显示这些产品，但出现错误“预期类型 'ProductList' 的值，但得到的类型为‘_Future’”

这里是负责 api 调用的函数，它 return 一个 ProductList 类型的 Future:

Future<ProductList> loadProductsByIdService(_serviceid) async {

  var datamap = {'service_id': _serviceid};
  var data = json.encode(datamap);
  ProductList products;

  final response = await http.post(Uri.parse(PRODUCTS),
      headers: {
        "Accept": "application/json",
        "Content-Type": "application/x-www-form-urlencoded"
      },
      body: data,
      encoding: Encoding.getByName("utf-8"));

  if (response.body.isNotEmpty) {

    if (response.statusCode == 200) {
      products = ProductList.fromJson(json.decode(response.body));
     
    }

  } else {
    throw Exception('echec de chargement des produits');
  }

  return products;
}

这里 class 负责展示产品

class PopularProducts extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var products = loadProductsByIdService(1) as ProductList;

    return Column(
      children: [
        Padding(
          padding:
              EdgeInsets.symmetric(horizontal: getPropotionalScreenWidth(20)),
          child: SectionTitle(title: "Produits à la Une", press: () {}),
        ),
        SizedBox(height: getPropotionalScreenWidth(20)),
        SingleChildScrollView(
          scrollDirection: Axis.horizontal,
          child: Row(
            children: [
              ...List.generate(
                products.products.length,
                (index) {
                  return ProductCard(product: products.products[index]);
                },
              ),
              SizedBox(width: getPropotionalScreenWidth(20)),
            ],
          ),
        )
      ],
    );
  }
}

我也遇到了这个错误： “errors.dart:187 未捕获（承诺）错误：格式异常：语法错误：JSON 输入意外结束”

Answer 1

因为，您必须等待该数据。或者，使用 FutureBuilder 获取该数据，这对我来说是最佳选择。

Answer 2

您正在尝试在获取数据之前对其进行绘制。您必须将列包装在 futureBuilder 中以等待该数据。

return FutureBuilder<ProductList>(
      future: loadProductsByIdService(1),
      builder: (context, snapShot) {
        if (snapshot.hasData) {
          return Column(
            children: [
              Padding(
                padding:
                    EdgeInsets.symmetric(horizontal: getPropotionalScreenWidth(20)),
                child: SectionTitle(title: "Produits à la Une", press: () {}),
              ),
              SizedBox(height: getPropotionalScreenWidth(20)),
              SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: Row(
                  children: [
                    ...List.generate(
                      snapShot.products.length,
                      (index) {
                        return ProductCard(product: snapShot.products[index]);
                      },
                    ),
                    SizedBox(width: getPropotionalScreenWidth(20)),
                  ],
                ),
              )
            ],
          ); 
        } else {
          return SizedBox();
        }
      },
    );

期望类型 'ProductList' 的值，但得到类型“_Future<ProductList>”之一

Expected a value of type 'ProductList', but got one of type '_Future<ProductList>'

flutter

flutter-futurebuilder