flutter 报错 如何解决？

Question

flutter报错'package:flutter/src/widgets/overlay.dart': Failed assertion: line 207 pos 12: '_overlay != null': is not true.

请教flutter报错问题：

void oneKeyOperate(Map data, String type) async {
    List ids = data["lightingLoopList"].map((item) {
      return item["id"];
    }).toList();
    List<Future<dynamic>> futures = [];
    for (var id in ids) {
      futures.add(performRequest({
        "loopIds": [id],
        "switchFlag": type == "open" ? '1' : '0'
      }));
    }
    await Future.wait(futures).then((value) {
      loadData();
    });
  }

  Future<void> performRequest(data) {
    return Request.post("/controlFarmLight", data: data);
  }

void loadData() {
    LoadingManager().showLoading(context);
    Request.getCallback(
      "park/app/farm/getLightList",
      success: (res)  {
        var encodeResponse = json.encode(res.data);
        var result = json.decode(encodeResponse);
        loopListData = result["data"]["list"];
        LoadingManager().hideLoading();
        setState(() {
          
        });
      },
      error: (err)  {
        LoadingManager().hideLoading();
        showOkAlertDialog(
          context: context,
          title: "提示",
          message: "出错了，请再试一次吧!",
          okLabel: "确定",
          style: AdaptiveStyle.adaptive,
        );
      }
    );
  }

我想要做的是等到所有请求完成后重新获取数据加载页面，但是只要在oneKeyOperate中写setState就会报错，Future.wait都是对的，请问为什么会出现这个错，应该怎么解决呢？

Answer 1

以下内容由AIGC及阿里嘎多学长共同生成、有用望采纳：

---

在Flutter中，setState 只能在 State 对象的 build 方法之外调用，并且需要确保是在主线程上调用。以下是针对你提出的问题的详细解答：

1. 为什么在Flutter的oneKeyOperate函数中使用setState会引发错误？ setState 调用时，如果当前不在主线程（UI线程）上，或者在Flutter的异步操作中没有正确地等待操作完成，就可能引发错误。错误 '_overlay != null': is not true 表明 setState 被调用时，_overlay 组件不存在，这通常发生在异步操作中。

2. 如何在Flutter的异步操作完成后，正确地使用setState来更新UI？ 异步操作完成后，应该确保在主线程上调用 setState。可以使用 Future.then 的回调函数来确保在异步操作完成后执行，或者使用 SchedulerBinding.instance.addPostFrameCallback 来确保在下一帧绘制之前调用 setState。

3. 错误提示'_overlay != null': is not true.具体指的是什么，以及如何在代码中避免这个错误？ 这个错误提示表明在调用 setState 时，Flutter的 Overlay 组件不存在。Overlay 是Flutter中用于显示弹窗、遮罩等的组件。避免这个错误的关键是确保在UI线程上调用 setState，并且不要在异步操作中直接调用它，而是在操作完成后通过回调来调用。

4. 我的Flutter应用中Future.wait的使用是否正确，并且如何确保它与setState协同工作以避免问题？ 你的 Future.wait 使用看起来是正确的，它等待所有异步请求完成。为了确保它与 setState 协同工作，你应该在 Future.wait 的 .then 回调中使用 setState，并且确保这个回调在主线程上执行。使用 SchedulerBinding.instance.addPostFrameCallback 是一种确保在UI线程上执行的好方法。

以下是修改后的代码示例：

void oneKeyOperate(Map data, String type) async {
  List ids = data["lightingLoopList"].map((item) {
    return item["id"];
  }).toList();
  List<Future<dynamic>> futures = [];
  for (var id in ids) {
    futures.add(performRequest({
      "loopIds": [id],
      "switchFlag": type == "open" ? '1' : '0'
    }));
  }
  
  // 使用SchedulerBinding确保在UI线程上执行
  await Future.wait(futures).then((value) {
    SchedulerBinding.instance.addPostFrameCallback((_) {
      loadData();
    });
  });
}

void loadData() {
  LoadingManager().showLoading(context);
  Request.getCallback(
    "park/app/farm/getLightList",
    success: (res)  {
      var encodeResponse = json.encode(res.data);
      var result = json.decode(encodeResponse);
      loopListData = result["data"]["list"];
      LoadingManager().hideLoading();
      
      // 使用SchedulerBinding确保在UI线程上执行
      SchedulerBinding.instance.addPostFrameCallback((_) {
        setState(() {
          // UI更新逻辑
        });
      });
    },
    error: (err)  {
      LoadingManager().hideLoading();
      showOkAlertDialog(
        context: context,
        title: "提示",
        message: "出错了，请再试一次吧!",
        okLabel: "确定",
        style: AdaptiveStyle.adaptive,
      );
    }
  );
}

通过这种方式，你可以确保在异步操作完成后，UI的更新是安全且正确的。