flutter - 以下断言被引发构建导航器

Question

构建第一个小部件时，我可以导航到另一个小部件吗？

构建Navigator- [GlobalObjectKey _WidgetsAppState＃1d8fb](脏，状态:NavigatorState＃999bc(代码:跟踪2个代码))时引发了以下断言:

我试图演示如何在不按任何按钮的情况下从一个屏幕导航到另一个屏幕，我的意思是，如果我在某个屏幕上，它将在几秒钟后不执行任何操作的情况下加载另一个屏幕，但是当我将导航器置于build方法之外时并用initState调用它会给我一个错误。
这是我的代码

 class Screen0 extends StatefulWidget {
  @override
  _Screen0State createState() => _Screen0State();
}

class _Screen0State extends State<Screen0> {
  @override
  void initState() {
    changeScreen();
    super.initState();
  }

  void changeScreen() {
    Navigator.push(context, MaterialPageRoute(builder: (context) {
      return MyHomePage(title: 'Flutter Demo Home Page');
    }));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold();
  }
}


--------------------- my other screen -----------------------------
import 'package:flutter/material.dart';

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.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

我使用changeScreen方法中的导航器代码修复了该问题:

Future(() {
        Navigator.push(
            context, MaterialPageRoute(builder: (context) => CityScreen()));
      });

谢谢大家的帮助!

Answer 1

您需要更多地了解Flutter中小部件的生命周期。调用initState时，框架正忙于将窗口小部件渲染到窗口小部件树。它在initState中所做的全部工作就是收集以某种方式呈现小部件所需的信息。

通过在initState中调用changeScreen()来执行的操作是，告诉flutter在已经构建了另一个小部件时就对其进行构建。这给出了一个错误。

仅在构建第一个窗口小部件时，您才能导航到(或构建)另一个窗口小部件。

现在，让我们谈谈如何完成您想做的事情。

一旦建立主屏幕，您想在不到一秒钟的时间内导航到另一个小部件。

您需要让flutter渲染其主窗口小部件(您要编辑其initState)，然后才告诉它导航至另一个窗口小部件。

像这样更改changeScreen()函数:

  changeRoute() async {
    await Future.delayed(Duration(seconds: 1), () {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => SecondRoute()),
      );
    });
  }

这里发生的是，事件循环等待1秒钟(由我们在Future.delayed方法中定义)，然后changeScreen()中的所有事件都会发生。在那一秒钟的末尾，flutter渲染其主窗口小部件并查找剩余的内容。还剩什么？我们的changeScreen()!

因此，一秒钟之后。屏幕导航。

PS:这个答案可能值得商as，因为我们不知道要花多少时间才能渲染主窗口小部件。如果花费的时间超过一秒(非常少)，则错误将持续存在。