【问题标题】:Bottom tab navigator show up when I click back button from my phone in flutter当我在手机上单击后退按钮时,底部选项卡导航器会出现
【发布时间】:2020-04-07 03:17:21
【问题描述】:

嗨,我是 Flutter 的新手,现在我尝试使用此代码为所有选项卡声明我的数据,但是当我单击选项卡时,底部导航器被关闭并在我单击手机上的后退按钮时再次显示,是有谁知道错误或问题?

class BottomTab extends StatefulWidget {
final String text;
BottomTab({this.text});
  @override
  _BottomTabState createState() => _BottomTabState();
}
class _BottomTabState extends State<BottomTab> {
void initState() {
    super.initState();
   }
_onTap(int index) {
    setState(() => _selectedIndex = index);
    if (index == 0) {
      Navigator.push(
          context,
          new MaterialPageRoute(
              builder: (BuildContext context) =>
                  new HomeScreen(value: widget.value)));
    } else if (index == 1) {
      Navigator.push(
          context,
          new MaterialPageRoute(
              builder: (BuildContext context) =>
                  new FirstPage(value: widget.value)));
    } else {
      Navigator.push(
          context,
          new MaterialPageRoute(
              builder: (BuildContext context) =>
                  new HomeScreen(value: widget.value)));
    }

  }
  final List<Widget> pages = [
    HomeScreen(),
FirstPage(),
  ];

  final PageStorageBucket bucket = PageStorageBucket();

  int _index = 0;

  Widget _myList(int index) => BottomNavigationBar(
        onTap: _onTap,
        currentIndex: index,
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('Home')),
BottomNavigationBarItem(icon: Icon(Icons.more), title: Text('More')),
        ],
      );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      bottomNavigationBar: _myList(_index),
      body: PageStorage(
        child: pages[_index],
        bucket: bucket,
      ),
    );
  }
}

【问题讨论】:

    标签: flutter navigation


    【解决方案1】:

    您可以在下面复制粘贴运行完整代码
    在您的情况下,您不需要 Navigator.push 并更改此行
    来自

    setState(() => _selectedIndex = index);
    

    setState(() => _index = index);
    

    工作演示

    完整代码

    import 'package:flutter/material.dart';
    
    class BottomTab extends StatefulWidget {
      final String text;
      BottomTab({this.text});
      @override
      _BottomTabState createState() => _BottomTabState();
    }
    
    class _BottomTabState extends State<BottomTab> {
      void initState() {
        super.initState();
      }
    
      _onTap(int index) {
        setState(() => _index = index);
        /*if (index == 0) {
          Navigator.push(
              context,
              new MaterialPageRoute(
                  builder: (BuildContext context) =>
                  new HomeScreen(value: widget.value)));
        } else if (index == 1) {
          Navigator.push(
              context,
              new MaterialPageRoute(
                  builder: (BuildContext context) =>
                  new FirstPage(value: widget.value)));
        } else {
          Navigator.push(
              context,
              new MaterialPageRoute(
                  builder: (BuildContext context) =>
                  new HomeScreen(value: widget.value)));
        }*/
      }
    
      final List<Widget> pages = [
        HomeScreen(),
        FirstPage(),
      ];
    
      final PageStorageBucket bucket = PageStorageBucket();
    
      int _index = 0;
    
      Widget _myList(int index) => BottomNavigationBar(
            onTap: _onTap,
            currentIndex: index,
            items: const <BottomNavigationBarItem>[
              BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('Home')),
              BottomNavigationBarItem(icon: Icon(Icons.more), title: Text('More')),
            ],
          );
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          bottomNavigationBar: _myList(_index),
          body: PageStorage(
            child: pages[_index],
            bucket: bucket,
          ),
        );
      }
    }
    
    class HomeScreen extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
              title: Text("demo"),
            ),
            body: Text("HomesScreen"));
      }
    }
    
    class FirstPage extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
              title: Text("demo"),
            ),
            body: Text("FirstPage"));
      }
    }
    
    void main() {
      runApp(MyApp());
    }
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: BottomTab(),
        );
      }
    }
    
    class MyHomePage extends StatefulWidget {
      MyHomePage({Key key, this.title}) : super(key: key);
    
      final String title;
    
      @override
      _MyHomePageState createState() => _MyHomePageState();
    }
    
    class _MyHomePageState extends State<MyHomePage> {
      int _counter = 0;
    
      void _incrementCounter() {
        setState(() {
          _counter++;
        });
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text(widget.title),
          ),
          body: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Text(
                  'You have pushed the button this many times:',
                ),
                Text(
                  '$_counter',
                  style: Theme.of(context).textTheme.headline4,
                ),
              ],
            ),
          ),
          floatingActionButton: FloatingActionButton(
            onPressed: _incrementCounter,
            tooltip: 'Increment',
            child: Icon(Icons.add),
          ),
        );
      }
    }
    

    【讨论】:

    • 但是从这段代码中我如何保存和传递我的数据,以便可以在主选项卡屏幕和更多选项卡屏幕中访问我的数据,因为我的目标是在整个选项卡中访问我的数据
    • 可以使用以下方法 1. 直接将变量放在所有类之外 2. 可以使用包pub.dev/packages/get_it 3. 可以使用provider
    猜你喜欢
    • 1970-01-01
    • 2021-03-09
    • 2021-10-09
    • 1970-01-01
    • 1970-01-01
    • 2016-01-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多