Flutter 'map' null 的动态调用。接收者：'_Future<dynamic>' 参数的实例：['(dynamic) => Builder' 的实例]

Question

我正在尝试使用此列表制作横幅，可以使用“getBannerList”函数访问它，而不必在此轮播中手动编写列表

如果我通过手动在项目中放置一个列表来设置项目：['base64string','base64string','base64string'].map 它会工作正常但是当我用函数替换它时它导致这个错误

错误

The following NoSuchMethodError was thrown building MyApp(dirty, dependencies: [MediaQuery], state: _MyAppState#5a46f):
'map'
Dynamic call of null.
Receiver: Instance of '_Future<dynamic>'
Arguments: [Instance of '(dynamic) => Builder']

轮播代码

Dependencies: carousel_slider: ^4.0.0

 CarouselSlider(
          options: CarouselOptions(
            height: MediaQuery.of(context).size.height * 0.15,
            autoPlay: true,
            autoPlayInterval: Duration(seconds: 5),
            initialPage: 0,
          ),
          items: getBannerList().map((e) {   // <---- if i replaced this with ['asdf','asdf,'asdf].map((e) it works fine
            return Builder(
              builder: (BuildContext context) {
                return Container(
                  width: MediaQuery.of(context).size.width,
                  margin: EdgeInsets.symmetric(horizontal: 5.0),
                  decoration: BoxDecoration(
                    image: DecorationImage(image: MemoryImage(base64Decode(e.toString()))),
                    color: Colors.white,
                  ),
                );
              },
            );
          }).toList(),
        ),

获取列表函数

 getBannerList() async{
    dynamic data = await getDashBoardBannerData();
    print(data);
    return data;
  }

returns（return 导致 base64 字符串太长的示例）：

['base64imgstring','base64imgstring','base64imgstring']

Answer 1

getBannerList 方法 returns Future<dynamic> 不是 List :
1- 将方法签名更改为 Future<List<String>> getBannerList() async{}
2- 在你的 StatefullWidget 中定义一个名为

的变量

late final Future<List> bannerList;

3- 在初始状态初始化你的变量

@override
void initState(){
 bannerList = getBannerList();
}

4- 现在我们应该使用 FutureBuilder 和我们的 basserList

FutureBuilder<List<String>>(
        future: bannerList, // your future data
        builder: (BuildContext context, AsyncSnapshot<List<String>> snapshot) {
          if (snapshot.hasData) {
            return CarouselSlider(
          options: CarouselOptions(
            height: MediaQuery.of(context).size.height * 0.15,
            autoPlay: true,
            autoPlayInterval: Duration(seconds: 5),
            initialPage: 0,
          ),
          items: snapshot.data.map((e) {
            return Builder(
              builder: (BuildContext context) {
                return Container(
                  width: MediaQuery.of(context).size.width,
                  margin: EdgeInsets.symmetric(horizontal: 5.0),
                  decoration: BoxDecoration(
                    image: DecorationImage(image: MemoryImage(base64Decode(e.toString()))),
                    color: Colors.white,
                  ),
                );
              },
            );
          }).toList(),
        );
          } else if (snapshot.hasError) {
            return Text('Loading Error'); // error state
          } else {

          return CircularProgressIndicator(); // loading state
        },

您应该使用显式类型以减少错误。

Flutter 'map' null 的动态调用。接收者：'_Future<dynamic>' 参数的实例：['(dynamic) => Builder' 的实例]

Flutter 'map' Dynamic call of null. Receiver: Instance of '_Future<dynamic>' Arguments: [Instance of '(dynamic) => Builder']

future

list

dynamic

carousel

flutter