Flutter - 在构建器内部的开关内调用导航器答案

【问题标题】：Flutter - call Navigator inside switch which it is inside builderFlutter - 在构建器内部的开关内调用导航器
【发布时间】：2021-03-06 07:09:35
【问题描述】：

我想在按下图标后导航到 QrScan 屏幕，但我收到了错误！！ setState() or markNeedsBuild() called during build 我想导航到该屏幕并从 QR 码获取数据，然后我希望这些数据显示在另一个屏幕上！

上面写着：

这个 Overlay 小部件不能被标记为需要构建，因为框架已经在构建小部件的过程中。仅当其祖先之一当前正在构建时，小部件才能在构建阶段标记为需要构建。这个例外是允许的，因为框架在子组件之前构建父小部件，这意味着将始终构建脏后代。否则，框架可能不会在此构建阶段访问此小部件。

调用 setState() 或 markNeedsBuild() 的小部件是：覆盖 - [LabeledGlobalKey#a5a46]

发出违规调用时当前正在构建的小部件是：builder

class MainTabsScreen extends StatefulWidget {
  @override
  _MainTabsScreenState createState() => _MainTabsScreenState();
}

class _MainTabsScreenState extends State<MainTabsScreen> {
  int page = 3;

  void _openScanner() {
    Navigator.push(context, MaterialPageRoute(builder: (context) => QrScan()));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Builder(
          builder: (context) {
            switch (page) {
              case 0:
                return ExploreScreen();
              case 1:
                return OffersScreen();
              case 2:
                _openScanner();
                break;
              case 3:
                return AltersScreen();
              case 4:
                return ChatsScreen();
              default:
                return ExploreScreen();
            }
          },
        ),
      ),
      bottomNavigationBar: ConvexAppBar(
        top: -20.0,
        backgroundColor: Colors.white,
        activeColor: Color(0xBB0BCC83),
        color: Color(0xBB0BCC83),
        height: 53.0,
        elevation: 0.0,
        initialActiveIndex: 3,
        items: [
          TabItem(
            icon: Icons.home,
            title: 'Home',
          ),
          TabItem(
            icon: Icons.list,
            title: 'Offers',
          ),
          TabItem(
            icon: Icons.qr_code,
            title: 'Scan',
          ),
          TabItem(
            icon: Icons.add_alert,
            title: 'Notification',
          ),
          TabItem(
            icon: Icons.chat,
            title: 'Chats',
          ),
        ],
        onTap: (id) {
          setState(() => page = id);
        },
      ),
    );
  }
}

【问题讨论】：

当onTap 本身的id 为2 时，为什么不调用navigator.push，而其余的可能是setState？这是有道理的，因为 builder 应该返回一个小部件，page==2 不是这种情况
先生。特伦斯，它有效！非常感谢。
很高兴我能帮上忙。发布相同的答案以帮助那些来到这里的人。
这是我的荣幸，如果您允许我与您联系，我将更加荣幸！
确定@KAMDeveloper，只需在linkedin上与我联系即可：)

标签： flutter dart flutter-navigation

【解决方案1】：

正如 cmets 中所讨论的，一种解决方案是在 id == 2 时在 onTap 函数中调用 navigator.push。

【讨论】：