解决flutter bottomnavigationbar页面切换时状态丢失问题

BottomNavigationBar是Flutter中的一个常用的组件，它可以在应用的底部显示一排图标和文本，让用户快速地在不同的页面之间切换。
但是，如果你使用过BottomNavigationBar，你可能会发现一个问题：当你切换到另一个页面后，原来的页面的状态就会丢失，比如ListView的滚动位置、输入框内容等。这是因为Flutter为了节省内存，不会保存每个页面的状态，而是每次切换时都会重新创建页面。这样虽然可以提高性能，但是也会影响用户体验。
那么，有没有办法解决这个问题呢？答案是肯定的，本文将介绍几种常用的方法，让你的BottomNavigationBar页面切换时能够保持状态。

使用IndexedStack

IndexedStack是一个特殊的容器组件，它可以同时包含多个子组件，但是只显示其中一个。它的特点是它会预先创建并缓存所有的子组件，而不是根据当前显示的子组件来动态创建和销毁。这样就可以避免每次切换时重新创建页面，从而保持页面状态。要使用IndexedStack，我们只需要将它作为Scaffold的body参数，然后将我们要显示的页面作为它的children参数。同时，我们还需要设置一个index参数，来控制当前显示哪个子组件。这个index参数可以和BottomNavigationBar的selectedIndex参数保持一致，这样就可以实现页面和导航栏的同步切换。下面是一个简单的示例代码：

import 'package:flutter/material.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _currentIndex = 0; //当前选中的页面索引
  final List<Widget> _pages = [ //要显示的页面列表
    Page1(),
    Page2(),
    Page3(),
    Page4(),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('BottomNavigationBar示例'),
      ),
      bottomNavigationBar: BottomNavigationBar( //底部导航栏
        type: BottomNavigationBarType.fixed, //固定类型
        currentIndex: _currentIndex, //当前选中的索引
        onTap: (index) { //点击事件
          setState(() { //更新状态
            _currentIndex = index;
          });
        },
        items: [ //导航栏项目列表
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: '首页',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.book),
            label: '书籍',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.music_note),
            label: '音乐',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.movie),
            label: '电影',
          ),
        ],
      ),
      body: IndexedStack( //使用IndexedStack作为body
        index: _currentIndex, //当前显示的子组件索引
        children: _pages, //子组件列表
      ),
    );
  }
}

//以下省略Page1、Page2、Page3、Page4等页面组件的定义

使用IndexedStack的优点是简单易用，缺点是会占用更多的内存，因为所有的页面都会被提前创建并缓存。如果你有很多页面或者每个页面都很复杂，那么这种方法可能会影响性能。此外，IndexedStack也不支持页面之间