Flutter状态管理Provider示例解析
作者:顾安 发布时间:2023-02-10 07:09:17
什么是状态管理
状态管理是一个十分广泛的概念,因为状态无处不在。从广义角度讲状态管理就是页面跟代码、跟服务器进行数据同步。例如:你在某购物应用内,添加了一件商品,你需要在购物车页面进行展示。这就是一种状态。相反的,你在商品页面点击了添加到购物车,却在购物车页面没有发现或者过段时间它才展示了,这就是状态管理没有做好。这就是我所理解的状态管理。
官方给出的解释:状态管理就是当某个状态发生改变的时候,告知使用该状态的状态监听者,让状态所监听的属性随之改变,从而达到联动效果。
常见的状态管理框架有哪些
Provider
Provider是官方文档的例子用的方法,Google 比较推荐的用法,也是今天的主角。Provider的实现在内部还是利用了InheritedWidget,它就是用于提供数据,可以很方便的管理状态。
Redux
Redux是一种单向数据流架构,可以轻松开发,维护和测试应用程序,也是google推荐的状态管理方式。所有的状态都存储在Store里,View拿到Store的状态数据会映射成视图渲染。Redux不直接让view操作数据,通过dispatch一个action通知Reducer,状态变更(类似于vue中的vuex)。
GetX
GetX包含很多功能,各种弹出widget、路由管理、国际化、Utils、状态管理等所以我觉得它不单单是一个状态管理器,更像是一个框架(类似于vue cli)。关于GetX的争论也很多,今天我们不讨论。我的建议是,对于像我一样的小白,还是从Provider开始,打好基础再说。
Provider 使用
添加依赖
使用命令行方式
flutter pub add provider
pubspec.yaml 添加这样一行(并运行隐式flutter pub get):
dependencies:
provider: ^6.0.4
导入应用
import 'package:provider/provider.dart';
定义需要共享的数据
class ProviderData with ChangeNotifier {
int count = 0;
void increment() {
count++;
notifyListeners();
}
}
在应用程序入口初始化
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import './provider/index.dart';
import './page/HomePage.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
create: (_) => CountNotifier(),
child: MaterialApp(
debugShowCheckedModeBanner: false,
home: const Scaffold(
body: HomePage(),
),
),
);
}
}
使用共享数据
import 'package:flutter/material.dart';
import 'package:flutter_provider_example/provider_count_example/count_notifier.dart';
import './provider/provider.dart';
class ProviderExample extends StatefulWidget {
const ProviderExample({Key? key}) : super(key: key);
@override
State<ProviderExample> createState() => _ProviderExampleState();
}
class _ProviderExampleState extends State<ProviderExample> {
final counter = Provider.of<ProviderData>(context);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("InheritedWidget"),
),
floatingActionButton: FloatingActionButton(
onPressed: (){
counter.increment();
},
child: const Icon(Icons.add),
),
body: Center(
child: Text(counter.count.toString(),
style: const TextStyle(
color: Colors.red,
fontSize: 50
),
),
),
);
}
}
状态管理的好处
能有效分离 UI 层和数据处理层
帮助前端应用结构化数据
有效控制状态的变化
处理同步与异步
实现一些日志打印,热加,同构应用等功能
...
结束语
关于flutter状态管理的学习到这里就结束了,更多关于Flutter状态管理Provider的资料请关注脚本之家其它相关文章!
来源:https://juejin.cn/post/7169045609909846046


猜你喜欢
- 前言在之前我们分析 Tomcat catalina.bat 原理解析 时候,我们发现在启动tomcat的参数中存在 -Djava.
- 本文实例为大家分享了OpenGL实现多段Bezier曲线拼接的具体代码,供大家参考,具体内容如下运行程序的交互方式有点类似corelDraw
- 这两天遇到一个服务假死的问题,具体现象就是服务不再接收任何请求,客户端会抛出Broken Pipe。检查系统状态执行top,发现CPU和内存
- 很多学习Android程序设计的人都会发现每个人对代码的写法都有不同的偏好,比较明显的就是对控件响应事件的写法的不同。因此本文就把这些写法总
- 前言Java 语言很强大,但是,有人的地方就有江湖,有猿的地方就有 bug,Java 的核心代码并非十全十美。比如在 JDK 中居然也有反模
- Android 和 H5 都是移动开发应用的非常广泛。市面上很多App都是使用Android开发的,但使用Android来开发一些比较复杂附
- 1.@Value注解@Value注解的源码,如下所示@Target({ElementType.FIELD, ElementType.METH
- Bean Searcher 号称 任何复杂的查询都可以 一行代码搞定,但 Mybatis Plus 似乎也有类似的动态查询功能,它们有怎样的
- 1.准备工作1、JDK安装2、Maven安装3、Git安装4、jenkins安装以上软件安装成功后进入jenkins进行相关配置。如果需要通
- 这篇文章主要介绍了深入了解JVM字节码增强技术,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参
- 本文实例讲述了基于.net实现裁剪网站上传图片的方法。由于客户端Javascript不能操作文件,所以只能先上传图片再在服务器端剪切。1、上
- 前文传送门:Netty分布式高性能工具类同线程下回收对象解析异线程回收对象就是创建对象和回收对象不在同一条线程的情况下, 对象回收的逻辑我们
- Android 将view 转换为Bitmap出现空指针问题解决办法在做Android 项目的时候,有时候可能有这样的需求,将一个View
- Java NIO读取大文件已经不是什么新鲜事了,但根据网上示例写出的代码来处理具体的业务总会出现一些奇怪的Bug。针对这种情况,我总结了一些
- 存储过程:CREATE PROCEDURE [dbo].[Proc_GetInfo] @yw
- 题目给定count=0;让5个线程并发累加到1000;思路创建一个类MyRunnable,实现Runnable(继承Thread类也可)定义
- 我使用的版本是SpringBoot 2.6.4可以实现注入不同的库连接或是动态切换库<parent>
- import java.util.Arrays;/** * 栈的实现<br> * @author Skip&
- Spring中提供了很多PostProcessor供开发者进行拓展,例如:BeanPostProcessor、BeanFactoryPost
- 本文实例讲述了C# WinForm制作异形窗体与控件的方法。分享给大家供大家参考,具体如下:制作异形窗体或控件的思路一般都是想办法生成一个r