Flutter问题：currentIndex来自其他类时页面内容不更新

自定义了BottomBar类实现TabBar，其中的currentIndex属性在点击标签时能正常更新，但在_MyHomePageState中实例化BottomBar后，通过tabs[b.currentIndex]切换页面内容时，页面不会随着currentIndex的变化刷新。代码示例如下：

class _MyHomePageState extends State<MyHomePage> {
  final tabs = [const PageDashboard(), const PageProfile()];

  BottomBar b = const BottomBar();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: tdGreen,
        title: const Text("test"),
      ),
      body: tabs[b.currentIndex],
      bottomNavigationBar: b,
    );
  }
}

1. 状态不共享且无通知机制：BottomBar内部的currentIndex变化时，没有通知到父组件_MyHomePageState。b只是_MyHomePageState里的普通变量，不是Flutter的状态变量——只有被setState包裹的状态变化，才会触发组件重新执行build方法刷新UI。
2. 不可变实例限制：你把BottomBar实例化为const，这意味着它是不可变对象，即便内部逻辑修改了currentIndex，也无法触发父组件的状态更新。

方式一：将状态提升到父组件（简单场景首选） #

把currentIndex放在_MyHomePageState中作为状态变量，通过回调函数让BottomBar点击时更新父组件状态：

class _MyHomePageState extends State<MyHomePage> {
  final tabs = [const PageDashboard(), const PageProfile()];
  // 把currentIndex作为父组件的状态变量
  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: tdGreen,
        title: const Text("test"),
      ),
      body: tabs[_currentIndex],
      // 给BottomBar传递当前索引和点击回调
      bottomNavigationBar: BottomBar(
        currentIndex: _currentIndex,
        onTap: (index) {
          setState(() {
            _currentIndex = index;
          });
        },
      ),
    );
  }
}

同时修改BottomBar，接收外部传入的索引和回调：

class BottomBar extends StatelessWidget {
  final int currentIndex;
  final Function(int) onTap;

  const BottomBar({super.key, required this.currentIndex, required this.onTap});

  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
      currentIndex: currentIndex,
      onTap: onTap,
      // 补充你的Tab配置
      items: const [
        BottomNavigationBarItem(icon: Icon(Icons.home), label: "首页"),
        BottomNavigationBarItem(icon: Icon(Icons.person), label: "我的"),
      ],
    );
  }
}

方式二：使用状态管理工具（复杂场景） #

如果项目页面多、状态逻辑复杂，可使用Provider、Riverpod或Bloc等状态管理工具，将currentIndex放在跨组件的状态容器中，让页面和BottomBar共享同一状态源，状态变化时自动触发UI刷新。

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