Flutter 状态管理Provider
Flutter 状态管理分为两类
1.无状态：StatelessWidget 意味着他们属性不可变
2.有状态: StatefulWidget 持有的状态可能在Widget生命周期中发生改变
当我们项目简单的时候可能并不需要状态管理，但是随着功能的增加，应用程序将有几十个甚至几百个应用状态，当我们想在多个页面（组件/Widget）之间共享状态（数据），或者一个页面（组件/Widget）中的多个子组件之间共享状态（数据），应用状态就会变的很难维护，Flutter 实际一开始就为我们提供了一种状态管理方式，那就是StatefulWidget，但是很快发现他就是造成了上述问题的根源，因此使用Provider 进行管理状态。
作用：
顶层的widget,用来存储数据，并不操作数据，存储的数据对象 必须extends ChangeNotifier；
最终效果：
当在SecondPage中点击增加值后，返回到FirstPage中的值也会跟随变化
Provider是flutter 中的状态管理 开源库，使用方法
1.在pubspec.yaml（配置文件）文件中添加Provider的依赖
2.创建数据模型
import 'package:flutter/cupertino.dart';
class Counter with ChangeNotifier {
///存储数据
int_count =0;
///提供外部能够访问的数据
intget count =>_count;
///提供更改数据的方法
void increment() {
_count++;
///通知所有听众进行刷新
notifyListeners();
}
}
3.创建顶层共享数据，这里使用MultiProvider可以创建多个顶层共享数据，应为实际项目中可能有多个数据模型
在main.dart 入口函数中创建
@override
Widget build(BuildContext context) {
///使用MultiProvider可以创建多个顶层共享数据
return MultiProvider(
providers: [ChangeNotifierProvider(create: (_) =>Counter())],
child:MaterialApp(
title:'Flutter之旅',
home:isSplash ?LoginPage() :SplashPage(),
),
);
}
四、在子页面中获取状态，我们分别编写了两个类FirstPage 和 SecondPage
获取顶层数据的方法就是：Provider.of<Counter>(context).count
调用数据模型中的 increment 刷新数据：Provider.of<Counter>(context,listen:false).increment();
创建第一个页面FirstPage
package:flutter/material.dart';
import 'package:flutter_app1/common/utils/NavigatorUtil.dart';
import 'package:flutter_app1/module/login/myprovider/Counter.dart';
import 'package:flutter_app1/module/login/myprovider/second_page.dart';
import 'package:provider/provider.dart';
class FirstPage extends StatelessWidget {
const FirstPage({Key key}) :super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar:AppBar(
title:Text("第一个页面"),
),
body:Column(
children: [
///获取计数器中的Count值
Text("${Provider.of(context).count}"),
GestureDetector(
onTap: () {
NavigatorUtil.pushRightOrLeft(context, SecondPage());
},
child:Container(
width: MediaQuery.of(context).size.width,
height:40,
decoration:BoxDecoration(color: Colors.black26),
child:Center(
child:Text("点击下一页", style:TextStyle(color: Colors.white)),
),
),
)
],
),
);
}
}
创建第二个界面 SecondPage
import 'package:flutter/material.dart';
import 'package:flutter_app1/module/login/myprovider/Counter.dart';
import 'package:provider/provider.dart';
class SecondPage extends StatelessWidget {
const SecondPage({Key key}) :super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar:AppBar(
title:Text("第二个页面"),
),
body:Center(
///获取计数器中的Count值
child:Text("${Provider.of(context).count}"),
),
floatingActionButton:FloatingActionButton(
onPressed: (){
///调用数据模型中的 increment 刷新数据
Provider.of(context,listen:false).increment();
},
child:Icon(Icons.add),
),
);
}
}
