Flutter - 未来的建设者:我应该何时使用它

问题描述 投票:6回答:1

我想知道何时应该使用未来的构建器。例如,如果我想创建一个http请求并在列表视图中显示结果,那么只要打开视图,我是否必须使用future构建器或者只需构建一个ListViewBuilder

new ListView.builder(
        itemCount: _features.length,
        itemBuilder: (BuildContext context, int position) {
...stuff here...
}

此外,如果我不想构建列表视图但是想要一些更复杂的东西,比如圆形图表,我是否应该使用未来的构建器?

希望它足够清楚!

dart flutter future builder
1个回答
15
投票

FutureBuilder删除了一些样板代码。

让我们说你想要fetch data from backend启动页面和显示加载器直到数据来。

ListBuilder的任务:

  • 有两个状态变量1.dataFromBackend 2.isLoadingFlag
  • 在发布时,设置isLoadingFlag = true并根据哪个显示loader
  • 一旦数据到达,用你从backend获得的数据设置数据并设置isLoadingFlag = false(显然在setState内)
  • 我们需要在if-else创作中有一个widget。如果isLoadingFlagtrue,显示loader其他显示data。如果失败,请显示error message

FutureBuilder的任务:

  • 在Future Builder的future中提供异步任务
  • 基于connectionState,展示messageloadingactive(streams)done
  • 基于data(snapshot.hasError)显示视图

FutureBuilder的优点

  • 没有two flags和没有setState
  • 反应式编程(FutureBuilder将负责更新数据到达的视图)

例:

    new FutureBuilder<String>(
        future: _fetchNetworkCall, // async work
        builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
           switch (snapshot.connectionState) {
             case ConnectionState.waiting: return new Text('Loading....');
             default:
               if (snapshot.hasError)
                  return new Text('Error: ${snapshot.error}');
               else
              return new Text('Result: ${snapshot.data}');
            }
         },
        )

绩效影响:

我只是查看了FutureBuilder代码,以了解使用它的性能影响。

  • FutureBuilder只是一个StatefulWidget,其state变量是_snapshot
  • 最初的状态是qazxsw poi
  • 它订阅_snapshot = new AsyncSnapshot<T>.withData(ConnectionState.none, widget.initialData);,我们在构造函数中发送并基于此更新futurestate

因此,widget.future.then<void>((T data) { if (_activeCallbackIdentity == callbackIdentity) { setState(() { _snapshot = new AsyncSnapshot<T>.withData(ConnectionState.done, data); }); } }, onError: (Object error) { if (_activeCallbackIdentity == callbackIdentity) { setState(() { _snapshot = new AsyncSnapshot<T>.withError(ConnectionState.done, error); }); } }); 是我们通常所做的包装/样板。所以不应该有任何性能影响。

© www.soinside.com 2019 - 2024. All rights reserved.