You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

无法从window EventListener修改Flutter Widget状态(已解决)

更新 - 问题已解决

经排查,该问题并非Flutter端的EventListener/State问题,而是由父网站侧切换iFrame所在div的可见性导致。


问题描述

我参考了一篇关于Flutter Web监听iFrame消息的文章,尝试从父网站向嵌入在iFrame中的Flutter子应用发送消息。消息可正常接收,我能在Flutter应用中打印消息值,但无法从事件监听器中成功调用setState以更新界面使用该消息值。

网站端代码与参考文章一致,我的Flutter应用代码如下:

class HomePageWidget extends StatefulWidget {
  const HomePageWidget({Key? key}) : super(key: key);

  @override
  _HomePageWidgetState createState() => _HomePageWidgetState();
}

class _HomePageWidgetState extends State<HomePageWidget> {
  String? messageValue;

  @override
  void initState() {
    html.window.addEventListener('message', listen, true);
    super.initState();
  }

  @override
  void dispose() {
    html.window.removeEventListener('message', listen, true);
    super.dispose();
  }

  void listen(html.Event event) {
    var data = (event as html.MessageEvent).data;
    final received = data['message'];

    // 这里能正常执行
    print(received);

    // 这里无法生效
    setState(() {
      messageValue = received;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Text(messageValue ?? 'no message');
  }
}

我已确认listen()方法能接收到消息,原本期望在此方法中调用setState更新状态,请问这是否因该方法从有状态组件的init方法调用而存在作用域问题?


内容的提问来源于stack exchange,提问作者ECS

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.19 05:00:12