在 setState 中使用 Navigator

Question

我有一个字符串列表（称为问题）。我根据列表中的当前字符串创建了一个文本小部件。我有一个索引 int，每次按下按钮时它都会增加。我在 setState 方法中将当前索引增加 1。当当前索引达到 String 列表的长度时，我需要导航到另一个页面。否则，我自然会得到一个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,
          ),
        ),
      ),

setState方法不是应该直接进入页面再运行build方法吗？

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

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

Answer 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

在 setState 中使用 Navigator

Using Navigator inside setState

setstate

flutter