flutter之状态管理provide的超简单demo
业务流程图
简单的业务流程图,如果有用过vuex,都是类似的东西,换汤不换药
如何使用
1、引入provide依赖
2、新建状态仓库
3、触发状态改变
4、页面引用创库变量
● 引入provide依赖
● 新建状态仓库
在lib目录下新建provide文件夹,在provide文件夹下新建创库文件counter.dart
import 'package:flutter/material.dart'; class Counter with ChangeNotifier{ int value = 0; add(){ value++; notifyListeners(); //通知引用该变量地方的改变值 } subtract(){ value--; notifyListeners(); //通知引用该变量地方的改变值 } }
●触发状态改变和页面引用
import 'package:flutter/material.dart'; import 'package:provide/provide.dart'; import './provide/counter.dart'; void main(){ //main函数里面引用provide var counter = Counter(); var providers =Providers(); providers..provide(Provider<Counter>.value(counter)); runApp(ProviderNode(child: MyApp(),providers: providers,)); } class MyApp extends StatelessWidget{ @override Widget build(BuildContext context){ return MaterialApp( title: "flutter provide", home: Scaffold( appBar: AppBar( title: Text("flutter provide"), ), body: Container( child:Column( children: <Widget>[ GetProvideValue(), AddButton(), SubButton(), ], ) ), ), ); } } //获取provide状态里面的值 class GetProvideValue extends StatelessWidget{ @override Widget build(BuildContext context){ return Container( child: Provide<Counter>( //在其他页面也是用同样的方法可以引用到provide里面的参数 builder: (context,child,counter){ return Text( "${counter.value}" ); }, ), ); } } //改变provide状态的值,调用provide里面的方法 class AddButton extends StatelessWidget{ @override Widget build(BuildContext context){ return RaisedButton( onPressed: (){ Provide.value<Counter>(context).add(); }, child: Text("增加"), ); } } //改变provide状态的值,调用provide里面的方法 class SubButton extends StatelessWidget{ @override Widget build(BuildContext context){ return RaisedButton( onPressed: (){ Provide.value<Counter>(context).subtract(); }, child: Text("减少"), ); } }
新建完项目,直接把上面2段代码复制就可以运行了
相关推荐
csdnYF 2020-11-15
SemiraChen 2020-10-10
YejiaSun 2020-09-27
csdnYF 2020-09-20
FrankAbagnale 2020-09-15
wmd看海 2020-07-27
szintu 2020-07-05
chaoxiao 2020-07-04
wmd看海 2020-06-27
龙衣 2020-06-26
龙衣 2020-06-09
龙衣 2020-06-08
wmd看海 2020-06-04
Samlss 2020-06-04
wmd看海 2020-06-04
csdnYF 2020-05-30
androidgjw 2020-05-28
wmd看海 2020-05-28
wmd看海 2020-05-19