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中完成
相关推荐
恋猫de小郭12 小时前
Android 限制侧载新进展,谷歌联合国内厂商推验证计划
android·前端·flutter
恋猫de小郭13 小时前
解读 Android 17 全新内存限制,有没有“豁免”后门?
android·前端·flutter
代码煮茶14 小时前
React 组件封装方法论 —— 以 Todo App 为例
javascript·react.js
任沫15 小时前
Agent之Function Call
javascript·人工智能·go
默_笙16 小时前
🛬 我让 AI 帮我写了一个打飞机游戏,结果 Canvas 把我整不会了
前端·javascript
梯度不陡16 小时前
AI 到底能不能从零写软件?ProgramBench 和 RepoZero 给出了两种答案
前端·javascript·面试
胡萝卜术18 小时前
滑动窗口最大值:从暴力到单调队列,层层优化全解析
前端·javascript·面试
kyriewen19 小时前
2026 年了,这 6 个 npm 包可以卸载了——浏览器原生 API 已经能替代
前端·javascript·npm
铁皮饭盒20 小时前
bun直接tsx,优雅!
javascript·后端
_柳青杨1 天前
一文吃透 Node.js 事件循环:从原理到 Node 20+ 重大变更
javascript·后端