Flutter开发：如何从底部导航栏向UserProfileScreen传isNewUser参数

我有一个UserProfileScreen组件，用于新增或编辑用户，需要根据进入场景传递bool类型的isNewUser参数：从侧边栏进入时传true（新增用户），从底部导航栏进入时传false（编辑用户）。目前侧边栏的传参逻辑已完成，但底部导航栏的传参方式尚未解决，相关代码如下：

MainScreenState 代码 #

class MainScreenState extends State<MainScreen> {
  final auth = FirebaseAuth.instance;
  int _pageIndex = 0;

  final List<Widget> appScreens = [
    const CompanyDashboardScreen(),
    const TransactionDetailScreen(true),
    const AppointmentCalendarScreen(),
    const UserProfileScreen(),
    const ChatScreen(),
  ];

  Future<void> signOut() async {
    await auth.signOut();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const CustomAppBar(),
      body: Container(child: appScreens[_pageIndex]),
      drawer: Drawer(
        child: (ListView(
          padding: EdgeInsets.zero,
          children: [
            const UserAccountsDrawerHeader(
              accountName: Text('Billy Bob Baker'),
              accountEmail: Text('billy.bob.baker@gmail.com'),
            ),
            Column(
              children: <Widget>[
                ListTile(
                  title: const Text('Add Company'),
                  selected: _pageIndex == 5,
                  onTap: () {
                    Navigator.pop(context);
                    Navigator.push(
                        context,
                        MaterialPageRoute(
                            builder: (context) => const CompanyScreen(true)));
                  },
                ),
                ListTile(
                  title: const Text('Add User'),
                  selected: _pageIndex == 6,
                  onTap: () {
                    Navigator.pop(context);
                    Navigator.push(
                        context,
                        MaterialPageRoute(
                            builder: (context) =>
                                const UserProfileScreen(true)));
                  },
                ),
                ListTile(
                  title: const Text('Log Out'),
                  selected: _pageIndex == 7,
                  onTap: () {
                    // Update the state of the app
                    signOut();
                    // Then close the drawer
                    Navigator.pop(context);
                    Navigator.push(
                        context,
                        MaterialPageRoute(
                            builder: (context) => const LoginScreen()));
                  },
                ),
              ],
            ),
          ],
        )),
      ),
      bottomNavigationBar: BottomNavigationBar(
        backgroundColor: Colors.blueAccent,
        selectedIconTheme: const IconThemeData(color: Colors.white),
        selectedItemColor: Colors.white,
        unselectedItemColor: Colors.black45,
        type: BottomNavigationBarType.fixed,
        currentIndex: _pageIndex,
        onTap: (value) {
          setState(() {
            _pageIndex = value;
          });
        },
        items: const [
          BottomNavigationBarItem(icon: Icon(Icons.home), label: "Home"),
          BottomNavigationBarItem(
              icon: Icon(Icons.add_business_outlined), label: "Trxn"),
          BottomNavigationBarItem(
              icon: Icon(Icons.calendar_today), label: "Calendar"),
          BottomNavigationBarItem(icon: Icon(Icons.people), label: "User"),
          BottomNavigationBarItem(icon: Icon(Icons.chat), label: 'Chat'),
        ],
      ),
    );
  }

  // Added this for BottomNavigationBar sync
  void setIndex(int index) {
    if (mounted) setState(() => _pageIndex = index);
  }
}

UserProfileScreen 代码 #

class UserProfileScreen extends ConsumerStatefulWidget {
  static const String id = 'user_profile_screen';
  final Users? users;
  final bool isNewUser;

  const UserProfileScreen([this.isNewUser = true, this.users]);

  @override
  ConsumerState<UserProfileScreen> createState() => _UserProfileScreenState();
}

解决方案 #

直接修改MainScreenState中appScreens列表里的UserProfileScreen实例化代码，显式传入isNewUser=false即可：

修改前：

const UserProfileScreen(),

修改后：

const UserProfileScreen(false),

完整修改后的appScreens列表代码：

final List<Widget> appScreens = [
  const CompanyDashboardScreen(),
  const TransactionDetailScreen(true),
  const AppointmentCalendarScreen(),
  const UserProfileScreen(false), // 显式传递isNewUser=false
  const ChatScreen(),
];

原理说明：UserProfileScreen的构造函数中isNewUser的默认值为true，之前底部导航栏切换到该页面时会使用默认值，现在显式传入false，就能让底部导航栏进入的场景对应编辑用户模式，和侧边栏的新增模式区分开。

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