【Flutter】点击底部不同的item实现切换Scaffold

要实现底部导航栏的不同项目切换不同的 Scaffold，您可以使用 IndexedStack 和 BottomNavigationBar 的组合。IndexedStack 可以根据当前所选的底部导航栏项目来切换不同的 Scaffold。以下是一个示例代码：

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

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

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Bottom Navigation Bar'),
      ),
      body: IndexedStack(
        index: _selectedIndex,
        children: <Widget>[
          Scaffold(
            body: Center(
              child: Text('Home Page'),
            ),
          ),
          Scaffold(
            body: Center(
              child: Text('Business Page'),
            ),
          ),
          Scaffold(
            body: Center(
              child: Text('School Page'),
          ),
        ],
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.business),
            label: 'Business',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.school),
            label: 'School',
          ),
        ],
        currentIndex: _selectedIndex,
        selectedItemColor: Colors.blue,
        onTap: (int index) {
          setState(() {
            _selectedIndex = index;
          });
        },
      ),
    );
  }
}

在这个示例中，我们使用 IndexedStack 来包裹不同的 Scaffold，根据底部导航栏当前所选的项目来切换不同的 Scaffold。当用户点击底部导航栏的项目时，会触发 onTap 回调函数，然后根据所选的项目更新 _selectedIndex，最终切换到对应的 Scaffold。