在 setState 中使用 Navigator答案

【问题标题】：Using Navigator inside setState在 setState 中使用 Navigator
【发布时间】：2020-06-15 12:06:54
【问题描述】：

我有一个字符串列表（称为问题）。我根据列表中的当前字符串创建了一个 Text 小部件。我有一个索引 int，每次按下按钮时都会增加。我在 setState 方法中将当前索引增加 1。当当前索引达到字符串列表的长度时，我需要导航到不同的页面。否则，我自然会得到 RangeError。

setState(() {
  this.currentIndex++;
  if(this.currentIndex == questions.length) {
    Navigator.of(context).push(
      MaterialPageRoute(builder: (context) => Loser()),
    );
  }
});

现在根据上面的代码，错误页面出现并迅速消失。很快就被 Loser() 页面取代了。

这是为什么呢？

如何导航到 Loser() 页面而不显示错误页面？

编辑：根据要求，错误信息：

════════ Exception caught by widgets library ═══════════════════════════════════

The following RangeError was thrown building LandingPage(dirty, state: _LandingPageState#a8efe):

RangeError (index): Invalid value: Not in inclusive range 0..10: 11

The relevant error-causing widget was
    LandingPage 
lib/main.dart:21
When the exception was thrown, this was the stack
#0      List.[]  (dart:core-patch/growable_array.dart:153:60)
#1      _LandingPageState.build 
package:testing_http_package/landing_page.dart:88
#2      StatefulElement.build 
package:flutter/…/widgets/framework.dart:4628
#3      ComponentElement.performRebuild 
package:flutter/…/widgets/framework.dart:4511
#4      StatefulElement.performRebuild 
package:flutter/…/widgets/framework.dart:4684
...
════════════════════════════════════════════════════════════════════════════════

编辑：我认为在构建方法中导致错误的小部件：

        child: Center(
          child: Text(
            questions[currentIndex], // This line
            style: style,
            textAlign: TextAlign.center,
          ),
        ),
      ),

在重新运行build方法之前setState方法不应该直接进入页面吗？

编辑：我根据@Nuts 的建议添加了 didChangeDependencies 方法，但它不起作用。现在只出现错误页面，并没有进入其他页面：

  @override
  void didChangeDependencies() {
    WidgetsBinding.instance.addPostFrameCallback((_) { 
      if(this.currentIndex == questions.length) {
        Navigator.of(context).push(
          MaterialPageRoute(builder: (context) => Loser()),
        );
      }
    });
    super.didChangeDependencies();
  }

【问题讨论】：

错误信息是什么，你是在构建方法中使用 Navigator 吗？
请分享错误信息。
我附上了错误信息。我在按下按钮时调用的方法中使用 setState。
你能发布完整的错误吗？看起来不是导航器错误
我很抱歉。我以为我之前复制了完整的错误消息。我现在已经更新了。现在它不是导航错误。这只是一个愚蠢的 RangeError。我想发出测验结束的信号并转到带有结果的新页面。这就是我在索引增加后立即进入导航器的原因。

标签： flutter setstate

【解决方案1】：

使用 setState - 您正在重建整个小部件并在执行此操作时 - 导航。因此，您正在尝试使用无效参数（在您的案例索引中）重建小部件

    this.currentIndex++;
    if(this.currentIndex => questions.length) {
      Navigator.of(context).push(
        MaterialPageRoute(builder: (context) => Loser()),
      );
    }
   else setState(() {}); // if currentIndex is valid, just rebuild

【讨论】：