Flutter中的状态更新

时间:2018-05-07 04:21:38

标签: state flutter

我是Flutter的新手,我遇到了解国家运作方式的问题 我在我的应用程序中设置了一个页面作为StatefulWidget,然后在该页面的状态内,其中一个主要组件是一个单独的StatefulWidget。

内部窗口小部件显示问题并允许用户输入答案。

我当时想要做的是在同一页面上显示下一个答案。

输入答案后,我的内部窗口小部件回调到我的页面状态。

我尝试用另一个副本替换我的内部窗口小部件,但状态未重置。这是一个未创建的新状态,并且永远不会再调用initState()。

我是否应该使用特定的电话或方法来实现这一目标?

编辑:例如,如果我有以下

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  @override
  void initState(){
     changeContent();
  }

  Widget innerWidget;
  void changeContent(){
     setState((){
        innerWidget = new CustomStatefullWidget();
     }
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: new Center(
        child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            innerWidget
          ],
        ),
      ),
    );
  }
}

这里CustomStatefullWidget是我创建的一个类,它是页面中独立的交互式部分。对于此示例,实际内容无关紧要。

我所期望的是每当调用changeContent()时,innerWidget就会有一个新的状态但事实并非如此。该状态已存储在树中,并且在创建窗口小部件的新实例时不会刷新 如何强制扑动清除树的那一部分或识别我想要重置状态?

1 个答案:

答案 0 :(得分:5)

这是预期的行为。当父级重建flutter将新的小部件树与旧的小部件树进行比较时。

通过这种方式,flutter能够知道哪些小部件已经“更新”,哪些小部件被添加/删除。

对于添加的小部件,它将创建一个新状态。调用initState。对于更新的小部件; flutter将重用旧的小部件并通过将旧的“小部件”部分作为参数作为参数传递来调用didUpdateWidget。至于删除的小部件,它会调用dispose

在您的情况下,您希望再次调用initState。但实际上它已经“更新”了。

从这一点开始,您有两种解决方案可以重置状态:

实施didUpdateWidget。哪会重置你的状态或做你想做的任何其他事情。 这是您应该考虑的最佳方法。因为您不一定要重置“new statefulwidget”的子项。

还有一个“懒惰”的解决方案,就是告诉人们“嘿,这是一个不同的小部件。不要重用旧的”。这是使用Key实现的。

关键用法here

中的更多信息

这就像将changeContent方法更改为以下内容一样简单:

Widget innerWidget;
void changeContent(){
  setState((){
      innerWidget = new CustomStatefullWidget(key: new UniqueKey());
  }
}