Flutter Stateful Widget重新创建状态

Flutter Stateful Widget重新创建状态,第1张

概述我正在开发一个扑动的应用程序,并认识到状态管理的意外行为.我创建了一个示例应用程序来重现行为,您可以在下面找到代码和日志输出. 该应用程序包含一个简单的ListView,其中包含10个有状态容器(文本装饰). 当我向下滚动时,每个容器及其容器状态将按预期创建一次.当我再次向上滚动时,Flutter会为显示屏上再次出现的每个容器小部件重新创建每个状态(但不是容器小部件). 我希望颤振会在没有重新创建 我正在开发一个扑动的应用程序,并认识到状态管理的意外行为.我创建了一个示例应用程序来重现行为,您可以在下面找到代码和日志输出.

该应用程序包含一个简单的ListVIEw,其中包含10个有状态容器(文本装饰).
当我向下滚动时,每个容器及其容器状态将按预期创建一次.当我再次向上滚动时,Flutter会为显示屏上再次出现的每个容器小部件重新创建每个状态(但不是容器小部件).
我希望颤振会在没有重新创建整个状态对象的情况下检索先前的状态.
我在这里做错了吗?


示例代码:

class MyHomePage extends StatefulWidget {  MyHomePage({Key key}) : super(key: key) {    print("MyHomePage constructor");  }  @overrIDe  _MyHomePageState createState() {    print("createState");    return _MyHomePageState();  }}class _MyHomePageState extends State<MyHomePage> {  _MyHomePageState() {    print("_MyHomePageState contructor");  }  voID initState() {    super.initState();    print("_MyHomePageState initState");  }  @overrIDe  Widget build(BuildContext context) {    return Scaffold(        body: ListVIEw.builder(          itemBuilder: (context,index) {            return ContainerWidget(index,key: ValueKey(index));          },itemCount: 10,));  }}class ContainerWidget extends StatefulWidget {  int index;  ContainerWidget(this.index,{key}) : super(key: key) {    print("ContainerWidget constructor for index $index");  }  @overrIDe  State<StatefulWidget> createState() {    print("ContainerWidget createState for index $index");    return _ContainerState();  }}class _ContainerState extends State<ContainerWidget> {  _ContainerState() {    print("_ContainerState constructor");  }  voID initState() {    super.initState();    print("_ContainerState initState for index ${Widget.index}");  }  @overrIDe  Widget build(BuildContext context) {    return Container(      child: Center(        child: Text("Index: ${Widget.index}"),),height: 200,decoration: Boxdecoration(        border: border(          bottom: borderSIDe(color: colors.green),);  }}

对数输出:

I/Flutter (22400): createStateI/Flutter (22400): _MyHomePageState contructorI/Flutter (22400): _MyHomePageState initStateI/Flutter (22400): ContainerWidget constructor for index 0I/Flutter (22400): ContainerWidget createState for index 0I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 0I/Flutter (22400): ContainerWidget constructor for index 1I/Flutter (22400): ContainerWidget createState for index 1I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 1I/Flutter (22400): ContainerWidget constructor for index 2I/Flutter (22400): ContainerWidget createState for index 2I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 2I/Flutter (22400): ContainerWidget constructor for index 3I/Flutter (22400): ContainerWidget createState for index 3I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 3I/Flutter (22400): ContainerWidget constructor for index 4I/Flutter (22400): ContainerWidget createState for index 4I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 4I/Flutter (22400): ContainerWidget constructor for index 5I/Flutter (22400): ContainerWidget createState for index 5I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 5I/Flutter (22400): ContainerWidget createState for index 1I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 1I/Flutter (22400): ContainerWidget createState for index 0I/Flutter (22400): _ContainerState constructorI/Flutter (22400): _ContainerState initState for index 0
解决方法@H_502_30@ 这是预期的,因为这些项目在离开屏幕时会被卸载.

如果你不想那样,你会想要使用我们称之为“保持活力”的东西.
你可以通过在你的State类中添加一个mixin来实现:

class _MyHomePageState extends State<MyHomePage> with automaticKeepAliveClIEntMixin {  bool get wantKeepAlive => true;  // ... }
总结

以上是内存溢出为你收集整理的Flutter Stateful Widget重新创建状态全部内容,希望文章能够帮你解决Flutter Stateful Widget重新创建状态所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1000583.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存