未來的轉換<list>在Flutter上市</list>

Question

import 'package:apps/sub_pages/Apparel_brand.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'Brands_api.dart';
import 'Food_brand.dart';
import 'Apparel_brand.dart';
import 'Gift_brand.dart';

class Brands extends StatefulWidget {
  var type;
  Brands({required this.type});

  @override
  _BrandsState createState() => _BrandsState();
}

class _BrandsState extends State<Brands> {
  late List result;
  void get_data(height, width) async {
    result = await Brands_API.ret_brands(height, width);
  }

  @override
  Widget build(BuildContext context) {
    double? height = MediaQuery.of(context).size.width * 0.40;
    var width = MediaQuery.of(context).size.width * 0.40;
    var interval_width = MediaQuery.of(context).size.width * 0.05;
    // var instance = Brands_API(
    //     height: height, width: width, interval_width: interval_width);
    // Future<List> result = Brands_API.ret_brands(height, width);
    // print(result);
    get_data(height, width);
    print(result);

    // var foods = result[2];
    // var gifts = result[0];
    // var apparel = result[1];
    // late var fin;
    // if (widget.type == 'food') {
    //   fin = Food(food: foods);
    // } else if (widget.type == 'apparel') {
    //   fin = Apparels(apparel: apparel);
    // } else {
    //   fin = Gifts(gifts: gifts);
    // }
    Widget fin = Text('Hello');
    return fin;
  }
}

// class Brand extends StatefulWidget {
//   const Brand({Key? key}) : super(key: key);
//
//   @override
//   _BrandState createState() => _BrandState();
// }
//
// class _BrandState extends State<Brand> {
//   @override
//   Widget build(BuildContext context) {
//     double? height = MediaQuery.of(context).size.width * 0.40;
//     var width = MediaQuery.of(context).size.width * 0.40;
//     var interval_width = MediaQuery.of(context).size.width * 0.05;
//
//     return Scaffold(
//         appBar: AppBar(
//           title: Text(
//             'Brand 1',
//             style: TextStyle(
//               color: Colors.black,
//               fontSize: 40,
//               fontFamily: 'poppins',
//               fontWeight: FontWeight.bold,
//             ),
//           ),
//           backgroundColor: Colors.white,
//           iconTheme: IconThemeData(color: Colors.black),
//           centerTitle: false,
//         ),
//         body: Container(
//           child: Padding(
//             padding: const EdgeInsets.fromLTRB(0, 40, 0, 0),
//             child: Column(
//               mainAxisAlignment: MainAxisAlignment.start,
//               children: [
//                 Row(
//                   mainAxisAlignment: MainAxisAlignment.center,
//                   children: [
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                     Card(height: height, width: width),
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                     Card(height: height, width: width),
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                   ],
//                 ),
//                 SizedBox(height: 15),
//                 Row(
//                   mainAxisAlignment: MainAxisAlignment.center,
//                   children: [
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                     Card(height: height, width: width),
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                     Card(height: height, width: width),
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                   ],
//                 ),
//                 SizedBox(height: 15),
//                 Row(
//                   mainAxisAlignment: MainAxisAlignment.center,
//                   children: [
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                     Card(height: height, width: width),
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                     Card(height: height, width: width),
//                     SizedBox(
//                       height: height,
//                       width: interval_width,
//                     ),
//                   ],
//                 ),
//               ],
//             ),
//           ),
//         ));
//   }
// }
//
// class Card extends StatelessWidget {
//   var width;
//   var height;
//
//   Card({required this.height, required this.width});
//
//   @override
//   Widget build(BuildContext context) {
//     return Container(
//       height: this.height,
//       width: this.width,
//       decoration: BoxDecoration(
//         borderRadius: BorderRadius.circular(20),
//       ),
//       child: Column(
//         children: [
//           Expanded(
//             flex: 3,
//             child: Container(
//               decoration: BoxDecoration(
//                 color: Colors.grey[600],
//               ),
//             ),
//           ),
//           Expanded(
//             flex: 2,
//             child: Container(
//               decoration: BoxDecoration(
//                 color: Colors.grey[300],
//               ),
//             ),
//           )
//         ],
//       ),
//     );
//   }
// }

在此代碼中，ret_brands 是一個 function，它返回一個 Future 類型的變量，我需要將其轉換為列表以便稍后使用它，正如您在注釋代碼的底部看到的那樣。 我嘗試使用 as List() （類型施法者），但這給了我這個錯誤：

類型“Future<List>”不是類型轉換中“List”類型的子類型

Answer 1

如果您想要一個列表，其中值來自 api 調用（未來）。 首先，您必須聲明一個空列表並在聲明列表中添加 list(Future) 值。

 List result= [];
  void get_data(height, width) async {
var list= await Brands_API.ret_brands(height, width);
result.add(list); 
}

如果您想在 api 調用上實現列表，請使用 future builder 和 listview.builder

Answer 2

我會鼓勵您在處理小部件樹上的未來時使用FutureBuilder 。

您可以更多地了解FutureBuilder以及何時應該使用 futureBuilder 。

 FutureBuilder(
              future: get_data(x, y),
              builder: (context, snapshot) {
                if (snapshot.connectionState == ConnectionState.waiting) {
                  return Center(child: Text('Please wait its loading...'));
                } else {
                  if (snapshot.hasError)
                    return Center(child: Text('Error: ${snapshot.error}'));
                  else
                    return Center(
                        child: new Text(
                            '${snapshot.data}')); 

                }
              },
            )

Answer 3

您可以等到數據准備好：

Future<List> get_data(height, width) async {
  return await Brands_API.ret_brands(height, width);
}

當使用這個 function 時這樣做：

  get_data(height, width).then((List value) => //your code);

或在異步方法中等待：

  List result = await get_data(height, width);