当前位置: 代码迷 >> 综合 >> Flutter 页面刷新数据 State的生命周期
  详细解决方案

Flutter 页面刷新数据 State的生命周期

热度:41   发布时间:2023-09-28 22:37:58.0

技术无止境,只怕不学习啊,Flutter 我们开始吧

flutter 是怎么刷新数据的刚开始接触的时候有点迷茫,经过一点探索原来是这个样子的。

在 Flutter 中,有两类常用的 Widget

  • 无状态的 StatelessWidget
  • 有状态的 StatefulWidget

StatelessWidget
StatelessWidget 是不能被改变的,比如:Icon、Text等。
如果控件一旦显示,就不需要再做任何的变更,那么使用 StatelessWidget。

class MyTestWidget extends StatelessWidget {
    @overrideWidget build(BuildContext context) {
    return _buildMyTestWidget(context);}

在 build() 中返回视图。

StatefulWidget

StatefulWidget 是有状态的,可变的。
可以改变外观,以响应用户的操作或者数据的变化。
StatefulWidget,是有一个设置状态的函数:

setState((){
    // 更新状态、数据
})

调用这个函数后,就会触发 StatefulWidget 的视图树重建。

练习的例子就不写了,创建Flutter项目时候的例子中就有了。

State的生命周期

直接上图:
Flutter 页面刷新数据 State的生命周期

生命周期函数 说明
constructor 构造函数
initState 这个方法是组件创建后的第一个方法,它相当于原生的 onCreate 和 viewDidLoad,大部分页面初始逻辑调用会写到这个方法中。
didChangeDependencies 当 State 对象的依赖发生变化时会被调用。例:你的 StatefulWidget 依赖一个 InheritedWidget 的数据,当数据发生变化时,会调用子 Widget 的该方法。
第一次打开页面时 initState 之后会立刻调用该方法
build 这个方法是最为重要的一个方法,它用来构建你的整个组件树。
didUpdateWidget 当父组件改变并且需要重新绘制 UI 时,这个方法会调用。
通过这个方法,你可以通过参数获取到旧的组件,你可以通过对比新旧组件后做一些额外的逻辑。
deactivate 当 State 对象从树中被移除时,会调用此回调。有些情况下,framework 会将该 State 插入到树的其它部分。
dispose 当 State 对象从树中被永久移除时调用。通常在此回调中释放资源
reassemble 此回调是专门为了开发调试而提供的,在热重载(hot reload)时会被调用,此回调在 Release 模式下永远不会被调用

操作场景

场景 1:打开页面:
constructor
initState
didChangeDependencies
build

场景 2:退出页面:
deactivate
dispose

场景 3:热重载:
reassemble
didUpdateWidget
build

场景 4:前台转后台:
AppLifecycleState.inactive
AppLifecycleState.paused

场景 5:后台转前台:
AppLifecycleState.inactive
AppLifecycleState.resumed

场景 6:横竖屏切换
didUpdateWidget
build
didUpdateWidget
build

自己创建测试项目练习吧。

  相关解决方案