Flutter有状态组件StatefulWidget

当继承StatelessWidget组件时,在组件中更新数据时页面不会立即刷新。

如果继承StatefulWidget时,只要在setState方法中更新数据后页面会实时更新数据。

Flutter有状态组件StatefulWidget

完整代码:

Dart 复制代码
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(primarySwatch: Colors.blue),
      home: Scaffold(
        appBar: AppBar(
          title: const Text("Flutter"),
        ),
        body: const MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const _HomePageState();
  }
}

///StatefulWidget:状态组件,改变页面数据状态
class _HomePageState extends StatefulWidget {
  const _HomePageState();

  @override
  State<_HomePageState> createState() => _HomePageStateState();
}

class _HomePageStateState extends State<_HomePageState> {
  final List<String> _list = ["数据一", "数据二", "数据三"];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: _list.map((v) {
          return ListTile(title: Text(v));
        }).toList(),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          setState(() {
            _list.add("新增数据");
          });
        },
        child: const Icon(Icons.add),
      ),
    );
  }
}
相关推荐
●VON28 分钟前
Flutter for OpenHarmony:基于可选描述字段与上下文感知渲染的 TodoList 任务详情子系统实现
学习·flutter·架构·交互·von
雨季66637 分钟前
构建 OpenHarmony 简易单位换算器:用基础运算实现可靠转换
flutter·ui·自动化·dart
一起养小猫43 分钟前
Flutter for OpenHarmony 实战:贪吃蛇游戏核心架构设计
flutter·游戏
无穷小亮1 小时前
Flutter框架跨平台鸿蒙开发——育儿知识APP的开发流程
flutter·华为·harmonyos·鸿蒙
嘴贱欠吻!2 小时前
Flutter鸿蒙开发指南(四):主页Tab栏实现
flutter
雨季6663 小时前
构建 OpenHarmony 跨设备任务协同中心:Flutter 实现多端任务流转与状态同步
flutter
●VON3 小时前
Flutter for OpenHarmony:基于可空截止日期与时间语义可视化的 TodoList 时间管理子系统实现
安全·flutter·交互·openharmony·跨平台开发
晚霞的不甘4 小时前
Flutter for OpenHarmony 引力弹球游戏开发全解析:从零构建一个交互式物理小游戏
前端·flutter·云原生·前端框架·游戏引擎·harmonyos·骨骼绑定
雨季6664 小时前
构建 OpenHarmony 智能场景自动化配置面板:Flutter 实现可视化规则编排
运维·flutter·自动化
[H*]4 小时前
Positioned高级定位技巧
flutter·华为·harmonyos