通过未来提供者价值查看Flutter列表

Question

我试图将类型为Future>的Future Provider的输出调用到List View构建器中。我认为我已经很接近了，因为我能够渲染最终的列表视图本身，但是，在此之前，出现了一个错误，并且在完成Future之后会迅速将其替换为列表视图。我相信我的实施可能有问题。

这是我到目前为止所拥有的（这些是我实际代码的派生产品，有太多不必要的事情了，我试图简化一下）：

class TempProvider extends ChangeNotifier(){
    List<Widget> _list = <Widget>[];
    List<Widget get list => _list;

    Future<List<Widget>> getList() async{
        List _result = await db....
        _result.forEach((_item){
            addToList(_item);
        });
    }

    addToList(Widget widget){
        _list.add(widget);
        notifyListeners();
    }
}

class Parent extends StatelessWidget{
    @override
    Widget build(BuildContext context) {
        return FutureProvider(
        create: (context) => TempProvider().getList(),
        child: Child(),
        );
    }   
}

class Child extends StatelessWidget{
    @override
    Widget build(BuildContext context) {
    var futureProvider = Provider.of<List<Widget>>(context);

        return FutureBuilder(
            initialData: <Widget>[],
            future: TempProvider().getList(),
            builder: (BuildContext context, AsyncSnapshot snapshot) {
                if (snapshot.connectionState == ConnectionState.none &&
                    snapshot.hasData == true) {
                    return ListView.builder(
                        itemCount: futureProvider.length,
                        itemBuilder: (BuildContext context, int index) {
                            return futureProvider[index];
                        },
                    );
                } else {
                    return Text('ALAWS');
                }
          },
        );
    }   
}

因此，基本上，我的Future的输出将是小部件列表，这些小部件将填充我尝试构建的列表视图。尽管我最终可以渲染列表视图，但是以下错误出现在其中：

The getter 'length' was called on null.
Receiver: null
Tried calling: length
The relevant error-causing widget was
FutureBuilder<List<Widget>> 

希望有人可以提供帮助，或者至少提供一个更好的例子。

非常感谢您！

Answer 1

不确定，但这是因为您的窗口小部件可能正在构建两次，并且最初的futureProvider为null，第二次它具有一定的价值。

解决方法：

替换：

futureProvider.length

与此：

futureProvider?.length ?? 0

上面的代码是做什么的？

1. futureProvider?.length：如果futureProvider为null，请不要访问它的长度。
2. 现在返回的值将为空。
3. ?? 0：如果返回的值为null，则返回0;

您需要考虑以下内容并编辑代码。

1. 首先futureProvider不应该为空。
2. 使用FutureBuilder时为什么不使用snaphot.data。

Answer 2

因此，我一直在进行研究，发现下面的文章根据我的需要显示了明确的实现方式：

Flutter Provider Examples - Codetober 感谢这篇文章的作者道格拉斯·托伯（Douglas Tober）。再次感谢Kalpesh的快速帮助！