Drawer导航中所有Widget启动即挂载的Flutter生命周期异常问题

问题根源 #

你遇到的生命周期异常是**IndexedStack的特性导致的**：IndexedStack会预加载所有子Widget并永久保留它们的状态，无论当前是否显示。这就解释了为什么所有页面在应用启动时就完成挂载，只有重启应用时才会触发dispose。

解决方案 #

替换IndexedStack为条件渲染逻辑，仅构建当前选中的页面Widget。这样切换页面时，未选中的页面会从Widget树中移除并触发dispose，新选中的页面会被挂载并执行初始化生命周期方法。

修改后的代码 #

修改selectedTabContent方法，去掉IndexedStack，改为根据当前索引返回对应页面：

Widget selectedTabContent() {
  switch(_drawerNavIndex) {
    case 0:
      return const TribeMailScreen();
    case 1:
      return const TribeHomeScreen();
    case 2:
      return const TribeAdvisorScreen();
    case 3:
      return const ConstructionScreen();
    default:
      return const TribeHomeScreen();
  }
}

或者如果偏好列表式管理页面，可改用构建器函数列表（避免提前实例化Widget）：

Widget selectedTabContent() {
  final List<Widget Function()> pageBuilders = [
    () => const TribeMailScreen(),
    () => const TribeHomeScreen(),
    () => const TribeAdvisorScreen(),
    () => const ConstructionScreen(),
  ];
  
  return pageBuilders[_drawerNavIndex]();
}

原理说明 #

• 条件渲染仅在当前索引匹配时才会创建并挂载对应的页面Widget；
• 当切换索引时，原页面Widget会被从Widget树中移除，触发dispose方法；
• 新页面Widget会被添加到树中，依次执行initState等初始化生命周期方法，完全符合你期望的“进入时挂载、离开时卸载”逻辑。

额外提示 #

如果后续有页面需要保留状态（切换后不销毁），可单独给该页面添加AutomaticKeepAliveClientMixin，但当前场景无需此处理。

内容的提问来源于stack exchange，提问作者Trax