setState() 在颤动的异步调用中不起作用答案

【问题标题】：setState() is not working in async calls in fluttersetState() 在颤动的异步调用中不起作用
【发布时间】：2018-11-04 17:59:07
【问题描述】：

我正在尝试读取一个名为mood.json 的json 文件并将其解析为一个名为“data”的列表，但是当我运行setState() 时，data 从未改变，对此问题有何帮助？代码如下所示：

class DisplayPage extends StatefulWidget {
    @override
  _DisplayPageState createState() => new _DisplayPageState();
}

class _DisplayPageState extends State<DisplayPage> {
  List _data = [];
  Directory dir;
  File jsonFile;
  String jsonPath;

    Future getData() async {
    dir = await getApplicationDocumentsDirectory();
    jsonPath = dir.path + "/" + "mood.json";
    jsonFile = new File(jsonPath);
    setState(() {
       _data = json.decode(jsonFile.readAsStringSync());
    });
  }

  @override
  void initState() {
    super.initState();
    getData();
    print(_data.length);
  }


@override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new  Text('Mood')
      ),
      body: new ListView.builder(
          itemCount: _data.length,
          itemBuilder: (BuildContext context, int index) {
          return new Card(
          child: new Text(_data[index]["title"]),
          );
          },),
    );
  }
}

【问题讨论】：

你在哪里打电话给setState？我在你的代码中看不到它。
你如何使用你的状态？
我重新编辑了问题，抱歉我的错误
@Phuc Tran 我想使用_data 列表来构建一个列表视图小部件，但解析后的_data 没有传递给状态。
什么文件包含上面的代码？当您在_data = ...; 之后添加print(_data); 时，是否会打印预期的数据？

标签： dart flutter

【解决方案1】：

我认为您的问题可能是其他问题；我拿走了你的代码并将网络调用更改为只需等待 5 秒，然后返回一些虚拟数据，它工作正常。

Future getData() async {
  await new Future.delayed(const Duration(seconds: 5));
  setState(() {
    _data = [
      {"title": "one"},
      {"title": "two"},
    ];
  });
}

您应该在 setState 调用中放置一个断点，以确保它确实被调用并且分配给 _data 的数据与您预期的一样。

【讨论】：

【解决方案2】：

等一下，伙计。让我们看看你的代码：

@override
void initState() {
    super.initState();
    /// getData(); /// this is an async method, and it's return a future. 
    /// you can use await instead so the code bellow getData() method execution 
    /// will be waiting for it to complete first.
    /// Here it is :
    await getData(); 
    print(_data.length); /// This print now will waiting until the getData completed
}

这里有一些参考资料：https://dart.dev/codelabs/async-await#working-with-futures-async-and-await

【讨论】：

【解决方案3】：

如this post中所述，使用

WidgetsBinding.instance.addPostFrameCallback((_) => setState(...));

而不仅仅是

setState(...)

【讨论】：