Flutter:为什么 setState(( ) { }) 一次又一次地设置数据

Question

我用 setState(() {})用于为变量赋值。但它一次又一次地打印。为什么会有这样的 react ？我该如何解决？
这是我的代码:

class Sample extends StatefulWidget {
  @override
  _SampleState createState() => _SampleState();
}

class _SampleState extends State<Sample> {
  String _message;
  String _appLink;
  Firestore db = Firestore.instance;
  @override
  Widget build(BuildContext context) {
    db.collection('share').document('0').get().then((value) {
      var message = value.data['message'];
      print(message);
      var appLink = value.data['appLink'];
      setState(() {
        _message = message;
        _appLink = appLink;
      });
    });
    return Container(
      child: Text('$_message $_appLink'),
    );
  }
}

Here is my Output:

这里_appLink值为 www.facebook.com

Answer 1

setState的目的|是告诉框架状态中的变量发生了变化，需要重建小部件以反射(reflect)该变化。所以调用setState调用build再次起作用，在您的情况下，这会记忆起您的 Future , 调用 setState再次触发 build等等。
要解决此问题，您应该调用 Future在 initState , 并使用 FutureBuilder准备好后显示数据。
例子:

class _SampleState extends State<Sample> {
  Firestore db = Firestore.instance;
  Future databaseFuture;

  @override
  void initState() {
    databaseFuture = db.collection('share').document('0').get()
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: databaseFuture,
      builder: (context, snapshot) {
        if(!snapshot.hasData) {
          return CircularProgressIndicator();
        }
        var message = snapshot.data.data['message'];
        print(message);
        var appLink = snapshot.data.data['appLink'];
        return Text('$message $appLink');
      }
    ),
  }
}