Question

我是新手，对导航器有疑问。我有2个视图，一个称为“家”和“列表”。我创建了一个在这两个视图中持久存在的抽屉。在每个视图中，我正在使用FutureBuilder创建对Firebase的引用。我遇到的问题是，每次我回到Home或List时，initState都会被再次调用。我相信问题出在从抽屉中选择页面。我的问题是如何仍能移动到其他页面，而不必每次更换屏幕时都需要调用InitState。

title: Text('Go to page 1'),
        onTap: () {
          Navigator.of(context)
              .push(MaterialPageRoute(builder: (context) => Listdb()));

这是我认为屏幕会自我重建的地方。有办法避免重建吗？谢谢您的帮助！

Answer 1

您可以使用AutomaticKeepAliveClientMixin来防止每次更改页面时重新加载，结合使用PageView可以实现更好的导航。我将在此处提供一个示例：

import 'package:flutter/material.dart';

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

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

class MyHomePage extends StatefulWidget {

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final PageController _pageController = PageController();

  Widget build(BuildContext context) {
    return Scaffold(
      drawer: Drawer(
        child: ListView(
          padding: EdgeInsets.zero,
          children: <Widget>[
            DrawerHeader(
              child: Text('Drawer Header'),
              decoration: BoxDecoration(
                color: Colors.blue,
              ),
            ),
            ListTile(
              title: Text('Item 1'),
              onTap: () {
                _pageController.jumpToPage(0);
                Navigator.pop(context);
              },
            ),
            ListTile(
              title: Text('Item 2'),
              onTap: () {
                _pageController.jumpToPage(1);
                Navigator.pop(context);
              },
            ),
          ],
        ),
      ),
      body: PageView(
        controller: _pageController,
        children: <Widget>[
          PageOne(),
          PageTwo(),
        ],
      ),
    );
  }
}

class PageOne extends StatefulWidget {
  @override
  _PageOneState createState() => _PageOneState();
}

class _PageOneState extends State<PageOne> with AutomaticKeepAliveClientMixin {
  @override
  void initState() {
    print("From PageOne - This will only print once");
    super.initState();
  }

  @override
  bool get wantKeepAlive => true;

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      backgroundColor: Colors.red,
    );
  }
}

class PageTwo extends StatefulWidget {
  @override
  _PageTwoState createState() => _PageTwoState();
}

class _PageTwoState extends State<PageTwo> with AutomaticKeepAliveClientMixin {
  @override
  void initState() {
    print("From PageTwo - This will only print once");
    super.initState();
  }

  @override
  bool get wantKeepAlive => true;

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Scaffold(
      backgroundColor: Colors.blue,
    );
  }
}

如何停止导航器以重新加载视图？

1 个答案: