zoukankan      html  css  js  c++  java
  • Flutter保持页面状态AutomaticKeepAliveClientMixin

    使用bottomNavigationBar切换底部tab,再切换回来就会丢失之前的状态(重新渲染列表,丢失滚动条位置)。

    解决方法

    使用 AutomaticKeepAliveClientMixin

    重写 bool get wantKeepAlive => true;

    build方法中调用super.build(context);

    class _MovieListState extends State<MovieList> with AutomaticKeepAliveClientMixin {
      List movieList = new List();
    
      @override
      bool get wantKeepAlive => true;
        
      @override
      Widget build(BuildContext context) {
        super.build(context);
        return ListView.builder(
          itemCount: movieList.length,
          itemBuilder: (context, index) {
            return MovieItem(
              item: movieList[index],
            );
          },
        );
      }
    }
    

    达到保存列表状态的效果

    ss.gif

    引用自官网的说明:

    Subclasses must implement wantKeepAlive, and their build methods must call super.build (the return value will always return null, and should be ignored).

    Then, whenever wantKeepAlive's value changes (or might change), the subclass should call updateKeepAlive.

    The type argument T is the type of the StatefulWidget subclass of the State into which this class is being mixed.

    参考链接:

    AutomaticKeepAliveClientMixin mixin

  • 相关阅读:
    列表方块与格式与布局
    框架与样式表的基本概念
    表单
    内容容器,常用标签
    CSS3
    表单验证
    练习题
    document对象
    windows对象
    函数
  • 原文地址:https://www.cnblogs.com/madlife/p/12446252.html
Copyright © 2011-2022 走看看