Flutter页面状态保留策略

目的: 防止每次点击底部按钮都进行一次页面渲染和网络请求

1. 使用IndexedStack

简单,只需要把被渲染的组件外部套一层IndexedStack即可

缺点: 在应用启动的时候,所有需要保存状态的页面都会直接被渲染,保存起来. 对性能有影响

2. 使用PageController

实现较为复杂,但是不用应用启动就全部加载

PageController实现页面状态保留步骤:

  1. 将要进行状态保留的页面使用PageView包裹,其中需要最少两个参数:controller和children. children就是要渲染的页面. controller需要自定义
  2. 自定义controller
  3. 在被渲染的页面中with AutomaticKeepAliveClientMixin 类, 重写 get方法进行配置,build方法中调用super.builder(context)


    ps: 前两步骤是在外层组件中设置的,如:foot组件Tabs, 在Tabs中渲染页面,如Home. 第三步则是在Home中完成
相关推荐
还有多久拿退休金18 分钟前
一个 var 让整个团队加班到凌晨——JS 闭包的那些暗坑
前端·javascript
weedsfly18 分钟前
用了 React/Vue 之后,这些 DOM 操作的坑你踩过几个?
前端·javascript
Asize21 分钟前
Ajax 入门:从 JSON 序列化到 XMLHttpRequest
前端·javascript·前端框架
铁皮饭盒1 小时前
@kognitivedev/rag, 用js做AI Agent开发
javascript·后端
恋猫de小郭1 小时前
苹果 AirPods 协议,Android 也可以使用完整版 AirPods 能力
android·前端·flutter
张风捷特烈2 小时前
Flutter 类库大揭秘#01 | path_provider架构与设计
android·flutter
kyriewen13 小时前
别再 console.log 了:5 个 Chrome DevTools 调试技巧,用过就回不去了
前端·javascript·面试
To_OC15 小时前
LC 1 两数之和:面试第一道必考题,暴力解法直接被面试官 pass
javascript·算法·leetcode
GuWenyue17 小时前
排序效率低?5分钟吃透快速排序,性能飙升至O(nlogn)
前端·javascript·面试
何时梦醒17 小时前
深入理解递归与快速排序 —— 从基础入门到手写实现
前端·javascript