flutter保持页面状态

最新推荐文章于 2025-06-11 21:18:16 发布

原创最新推荐文章于 2025-06-11 21:18:16 发布 · 851 阅读

1 ·

CC 4.0 BY-SA版权

flutter 专栏收录该内容

17 篇文章

订阅专栏

这篇博客介绍了如何在Flutter中使用AutomaticKeepAliveClientMixin混合类来保持子页面的活性，特别是在使用IndexedStack作为页面切换容器时，通过重写wantKeepAlive方法并返回true，确保Buy页面在后台仍然保持活跃状态。此外，还展示了如何在home.dart文件中配置IndexedStack以控制多个子页面的显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在子页面加上混合AutomaticKeepAliveClientMixin这个Mixin
重写wantKeepAlive方法，修改返回值为true
在home页面使用IndexedStack来控制页面显示

// home.dart
body: IndexedStack(
          index: 0, //当前的下标
          children: <Widget>[IndexPage(), Buy(), MyPage(), MyPage()]//子页面的Widget
          ),

// buy.dart
import 'package:flutter/material.dart';

class Buy extends StatefulWidget {
  Buy({Key key}) : super(key: key);

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

class _BuyState extends State<Buy> with SingleTickerProviderStateMixin, AutomaticKeepAliveClientMixin  {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Text("Buy页面"),
    );
  }
}

@override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;