Flutter中有状态组件(StatefulWidget)的生命周期分为多个阶段,涵盖从创建到销毁的整个过程。生命周期主要由State类的方法控制。

初始化阶段

createState() 

State组件开始被创建时会自动调用,生命周期内只会执行一次。

initState() 

State对象创建后立即调用,仅执行一次。通常用于初始化依赖项或订阅数据流。必须调用super.initState()

更新阶段

didChangeDependencies() 

State 依赖的数据改变时,即初始化时或者是外部传入的数据改变时自动调用的, 这个方法在两种情况下会调用:

情况一:调用initState会调用;

情况二:从其他对象中依赖一些数据发生改变时,比如前面我们提到的InheritedWidget(这个后面会讲到);

构建阶段

build()

构建组件结构并返回渲染好的组件实例,生命周期内会被执行多次

setState()

会根据最新的状态(数据)来重新调用build方法,构建对应的Widgets,只能在State对象内调用

didUpdateWidget()

该方法主要是组件重新构建时才会被调用的,当父组件重建并需要更新当前StatefulWidget时调用。通过比较新旧Widget配置来执行逻辑。

销毁阶段

deactivate()

组件从节点中移除时会自动调用,可以监听组件是否即将被销毁

dispose()

释放组件内存资源时会自动调用,可以监听组件是否被彻底销毁,如取消订阅、关闭控制器,必须调用super.dispose()

生命周期顺序总结

  1. 创建阶段:createState → initState → didChangeDependencies → build
  2. 更新阶段:didUpdateWidget → build
  3. 销毁阶段:deactivate → dispose

相关示例代码

import 'package:flutter/material.dart';

class LifeCase extends StatefulWidget {
  const LifeCase({Key? key}) : super(key: key);

  @override
  _LifeCaseState createState() {
    print("1.createState执行");
    return _LifeCaseState();
  }
}

class _LifeCaseState extends State<LifeCase> {
  int count = 0;

  @override
  void initState() {
    // TODO: implement initState
    super.initState(); // 必须调用
    print('2.initState'); // 在这里做数据请求
  }

  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    super.didChangeDependencies();
    print('3.didChangeDependencies'); // 在这里做数据请求
  }

  @override
  void didUpdateWidget(covariant LifeCase oldWidget) {
    // TODO: implement didUpdateWidget
    super.didUpdateWidget(oldWidget);
    print('5.didUpdateWidget');
  }

  @override
  Widget build(BuildContext context) {
    print('4.执行build函数');
    return Row(
      children: [
        ElevatedButton(
            onPressed: () {
              setState(() {
                count--;
              });
            },
            child: const Text("-")),
        Text(count.toString()),
        ElevatedButton(
            onPressed: () {
              setState(() {
                count++;
              });
            },
            child: const Text("+"))
      ],
    );
  }
}

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐