Flutter第三页调用setState返回第二页，Navigator.of.push无响应问题

嘿，我帮你揪出问题根源啦！你的代码里有两个关键问题导致了这些诡异的行为，咱们一步步来拆解：

核心问题 #

1. 页面未采用独立的StatefulWidget
   你把page3()、Profile()写成了普通的Widget函数，而不是独立的StatefulWidget类。setState()方法只能在State类的上下文里调用，你现在在Widget函数里调用的setState()其实属于最外层的首页State——这会触发首页的重建，进而打乱路由栈，导致第三页点击后跳回第二页。

2. 全局变量管理状态
   你用了全局变量check和check2来存页面状态，这会让所有页面共享同一份状态。修改变量时，多个页面的状态会被意外影响，再加上上面的Widget函数问题，整个状态更新逻辑完全混乱了。

修复后的代码示例 #

把每个页面都改成独立的StatefulWidget，让每个页面拥有自己的状态：

首页（HomePage） #

class HomePage extends StatefulWidget {
  const HomePage({super.key, required this.title});

  final String title;

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: FlatButton(
          child: const Text("press to start"),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(18.0),
            side: BorderSide(color: Colors.blue[100]!),
          ),
          color: Colors.white,
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => const ProfilePage()),
            );
          },
        ),
      ),
    );
  }
}

第二页（ProfilePage） #

class ProfilePage extends StatefulWidget {
  const ProfilePage({super.key});

  @override
  State<ProfilePage> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<ProfilePage> {
  // 把状态放在当前页面的State里，不再用全局变量
  String check = "go to next page";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Profile Page")),
      body: Center(
        child: FlatButton(
          child: Text(check),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(18.0),
            side: BorderSide(color: Colors.blue[100]!),
          ),
          color: Colors.white,
          onPressed: () {
            setState(() {
              // 仅更新当前页面的文本
              check = "updated text";
            });
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => const Page3()),
            );
          },
        ),
      ),
    );
  }
}

第三页（Page3） #

class Page3 extends StatefulWidget {
  const Page3({super.key});

  @override
  State<Page3> createState() => _Page3State();
}

class _Page3State extends State<Page3> {
  String check2 = "state1";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Page 3")),
      body: Center(
        child: FlatButton(
          child: Text(check2),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(18.0),
            side: BorderSide(color: Colors.blue[100]!),
          ),
          color: Colors.white,
          onPressed: () {
            // 这里的setState只属于Page3，只会更新当前页面
            setState(() {
              check2 = "state3";
            });
          },
        ),
      ),
    );
  }
}

修复说明 #

• 每个页面都是独立的StatefulWidget，拥有自己的State类，页面状态不再依赖全局变量，而是存在各自的State中。
• 每个页面的setState()只会触发当前页面的重建，不会影响其他页面，也不会打乱路由栈，解决了第三页点击后跳回第二页的问题。
• 每个页面都添加了Scaffold，符合Flutter的页面结构规范，导航栏也能正常显示。

另外，Navigator.of(context).push和Navigator.push本质是一样的，之前无效也是因为状态管理混乱，修复后就能正常工作啦。

内容的提问来源于stack exchange，提问作者Daniel Roger