FutureBuilder 错误：返回类型“对象？”不是闭包上下文所要求的“小部件”

Posted 2023-03-27

【中文标题】FutureBuilder 错误：返回类型“对象？”不是闭包上下文所要求的“小部件”

【英文标题】：FutureBuilder Error: The return type 'Object?' isn't a 'Widget', as required by the closure's context

【发布时间】：2021-11-13 01:43:29

【问题描述】：

我是 Flutter 的新手，我正在研究 Future Builder，当我在以下行运行代码时：return snapshot.data; 正在返回以下错误：The return type 'Object?' isn't a 'Widget', as required by the closure's context.

我认为这与 Null 安全性有关，因为当我将行：return snapshot.data; 更改为 return Text(snapshot.data.toString()); 时，它会呈现文本：ListView(ScrollDirection: vertical...ScrollPhysics)，但我可能对 Null 安全性有误。

下面的代码来自一个youtube教程：https://www.youtube.com/watch?v=y-IypschepA，我正在看，我在学习的时候一个字一个字地复制了代码，我已经验证了近20次我的代码正是导师编写并成功运行的代码。

我不确定如何解决此错误。

import 'package:flutter/material.dart';

class FutureBuilderTest extends StatefulWidget 
  @override
  _FutureBuilderTestState createState() => _FutureBuilderTestState();


class _FutureBuilderTestState extends State<FutureBuilderTest> 
  Future<void> loadList(BuildContext context) async 
    return Future.delayed(
      Duration(seconds: 1),
      () 
        return ListView.builder(
          itemCount: 40,
          itemBuilder: (context, index) 
            return Card(
              elevation: 8,
              child: Text(
                "Dummy Text $index",
                style: TextStyle(fontSize: 17, fontWeight: FontWeight.bold),
              ),
            );
          ,
        );
      ,
    );
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text("Future Builder Test"),
      ),
      body: FutureBuilder(
        future: loadList(context),
        builder: (context, snapshot) 
          if (snapshot.connectionState == ConnectionState.waiting) 
            return Center(
              child: CircularProgressIndicator(),
            );
          
          if (snapshot.connectionState == ConnectionState.done) if (snapshot
              .hasError) 
            return Center(
              child: Text(snapshot.data.toString()),
            );
          
          if (snapshot.data != null) 
            return snapshot.data;        // THIS LINE IS RETURNING THE ERROR
           else 
            return Center(
              child: CircularProgressIndicator(),
            );
          
        ,
      ),
    );
  

【参考方案1】：

FutureBuilder 中的构建器返回一个小部件（就像您在返回 CircularProgressIndicator 时所做的那样）。所以你不应该按原样返回 snapshot.data 。相反，将其放入一些小部件中以显示在屏幕上。 就像，

 if (snapshot.data != null) 
        print(snapshot.data);        
        return Center(
            child:Text(snapshot.data.toString(),
                ),
              ),
            );

【讨论】：

嗨莫尼克，我试过你说的，但没有解决错误。但是，我在观看另一个教程视频时找到了答案。我必须声明该行的类型：“builder: (context, snapshot)”。我发布了答案。

【参考方案2】：

没关系，我通过观看另一个教程发现了错误，这是一个类型错误，我必须通过插入类型来更正：builder: (context, snapshot)，现在显示为：builder: (BuildContext context, AsyncSnapshot snapshot)

这是 future 参考的工作代码（双关语）：

import 'package:flutter/material.dart';

class FutureBuilderTest extends StatefulWidget 
  @override
  _FutureBuilderTestState createState() => _FutureBuilderTestState();


class _FutureBuilderTestState extends State<FutureBuilderTest> 
  Future<void> loadList(BuildContext context) async 
    return Future.delayed(
      Duration(seconds: 1),
      () 
        return ListView.builder(
          itemCount: 40,
          itemBuilder: (context, index) 
            return Card(
              elevation: 8,
              child: Text(
                "Dummy Text $index",
                style: TextStyle(fontSize: 17, fontWeight: FontWeight.bold),
              ),
            );
          ,
        );
      ,
    );
  

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(
        title: Text("Future Builder Test"),
      ),
      body: FutureBuilder(
        future: loadList(context),
        builder: (BuildContext context, AsyncSnapshot snapshot) 
          if (snapshot.connectionState == ConnectionState.waiting) 
            return Center(
              child: CircularProgressIndicator(),
            );
          
          if (snapshot.connectionState == ConnectionState.done) if (snapshot
              .hasError) 
            return Center(
              child: Text(snapshot.data.toString()),
            );
          
          if (snapshot.data != null) 
            return snapshot.data;
           else 
            return Center(
              child: CircularProgressIndicator(),
            );
          
        ,
      ),
    );