本文只簡(jiǎn)單介紹Provider的用法和使用中遇到的問(wèn)題
2019 Google I/O 大會(huì)上误趴，官方正式介紹了 由社區(qū)作者 [Remi Rousselet] 與 Flutter Team 共同編寫的 [Provider] 代替 Provide 成為官方推薦的狀態(tài)管理方式之一前计。下面以最簡(jiǎn)單的計(jì)數(shù)器為例。
1.在pubspec.yaml中引入Provider 包
dependencies:
flutter:
sdk: flutter
provider : ^3.0.0+1
2.新建CouterProvider
import 'package:flutter/material.dart';
class CounterBloc with ChangeNotifier { //混入
int _counter = 0;
int get counter => _counter; //將couter 暴露出去
increment() {
_counter++;
notifyListeners(); // 通知狀態(tài)改變
}
decrement() {
_counter--;
notifyListeners();
}
}
3.在頂層注入Provider
import 'package:provider/provider.dart';
import './provide/couter.dart';
void main() {
Provider.debugCheckInvalidValueType = null; /*** Provider如果與Listenable/一起使用，現(xiàn)在拋出Stream苟穆〖巳蹋考慮使用ListenableProvider/ StreamProvider代替〕⑽或者铛只，可以通過(guò)設(shè)置Provider.debugCheckInvalidValueType 為null這樣來(lái)禁用此異常***/
runApp(
MultiProvider( //使用MultiProvider可管理多個(gè)Provider
providers: [
ChangeNotifierProvider(builder: (_) => HomeProvide()),
],
child: MyApp(),
),
);
}
4.頁(yè)面獲取數(shù)據(jù)和改變數(shù)據(jù)
// 方法一 通過(guò)Provider.of<CounterBloc>(context) 獲取數(shù)據(jù)方法
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
final counter =Provider.of<CounterBloc>(context); // 拿到Provider
return Scaffold(
appBar: AppBar(title: Text('provider計(jì)數(shù)器'),),
floatingActionButton: FloatingActionButton(
onPressed: (){
Provider.of<CounterBloc>(context, listen: false).increment(); /*** 調(diào)用增加方法，ChangeNotifierProvider通知依賴重建Widget 糠溜，此處特別注意listen:false,如果[listen]為“true”（默認(rèn)）淳玩，則以后的值更改將觸發(fā)小部件的新[state.build]和的[state.didchangeDependencies],，數(shù)據(jù)將會(huì)無(wú)限請(qǐng)求***/
},
child: Icon(Icons.add),
),
body: Container(
child: Center(
child: Text('${counter.counter}'),
),
),
);
}
}
// 方法二： 通過(guò)Consumer獲取數(shù)據(jù)
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
final counter =Provider.of<CounterBloc>(context);
return Consumer(
builder: (context,CounterBloc counter,_){
return Scaffold(
appBar: AppBar(title: Text('Provider計(jì)數(shù)器'),),
floatingActionButton: FloatingActionButton(
onPressed: (){},
child: Icon(Icons.add),
),
body: Container(
child: Center(
child: Text(counter.counter.toString()),
),
),
);
},
);
}
}
4.注意事項(xiàng)
Provider.of<T>(context) 會(huì)導(dǎo)致調(diào)用的 context 頁(yè)面范圍的刷新非竿。
Consumer 只刷新了 Consumer 的部分
建議盡量使用 Consumer 而不是 Provider.of<T>(context) 獲取頂層數(shù)據(jù)
特別注意盡量保證build 無(wú)副作用蜕着，不然頁(yè)面經(jīng)常重繪
如有不對(duì)，請(qǐng)指正
