詳解Flutter中數(shù)據(jù)傳遞的方式
在Flutter中,常見的數(shù)據(jù)傳遞一共有以下幾種:
1、構(gòu)造方法傳遞
Flutter的構(gòu)造方法具備著dart語言的特點(diǎn),參數(shù)具備可選狀態(tài),通過構(gòu)造方法傳遞數(shù)據(jù),可以很方便的將任意數(shù)據(jù)進(jìn)行傳遞,平時(shí)開發(fā)中,A跳轉(zhuǎn)B頁面最常用的方法就是通過構(gòu)造方法進(jìn)行傳遞。比如我們最常見的Key就是通過構(gòu)造一級(jí)一級(jí)向下傳遞的。
優(yōu)點(diǎn): 相鄰頁面之間傳遞數(shù)據(jù)非常方便,你不需要進(jìn)行任何額外的操作。
缺點(diǎn): 當(dāng)頁面層級(jí)過多以及類過多時(shí),需一級(jí)一級(jí)傳遞,寫起來非常麻煩,代碼耦合性高。
2、InheritedWidget
為了解決構(gòu)造函數(shù)一級(jí)一級(jí)鄉(xiāng)下傳遞的的缺點(diǎn),F(xiàn)lutter派生出了功能性組件InheritedWidget,通過它可以實(shí)現(xiàn)頂級(jí)widget的數(shù)據(jù)共享,也就是說無需一級(jí)一級(jí)向下傳遞,即可獲取數(shù)據(jù),比如A頁面有一個(gè)數(shù)據(jù),需要在C頁面使用,那么就可以不經(jīng)過B頁面獲取,前提ABC三個(gè)頁面是屬于一個(gè)Widget中的,常見的 TabView布局頂層數(shù)據(jù)共享,適合復(fù)雜頁面頂層向下傳遞數(shù)據(jù),使用也很簡(jiǎn)單。
示例代碼:
/// 數(shù)據(jù)共享
class TestData extends InheritedWidget {
final Widget child;
final String data; // 共享數(shù)據(jù)
// 構(gòu)造
const TestData({
Key? key,
required this.child,
required this.data,
}) : super(key: key, child: child);
/// 定義一個(gè)靜態(tài)方法 獲取數(shù)據(jù)
static String of(BuildContext context) {
// return context.dependOnInheritedWidgetOfExactType<TestDataestData>()?.data??"數(shù)據(jù)有誤";
return (context.getElementForInheritedWidgetOfExactType<TestData>()?.widget as TestData).data ;
}
@override
bool updateShouldNotify(covariant TestData oldWidget) {
return child != oldWidget.child;
}
}
然后在A頁面的根布局套上TestData,在C頁面通過of方法即可獲取數(shù)據(jù)。
兩種更新數(shù)據(jù)方法:
dependOnInheritedWidgetOfExactType: 子組件更新didChangeDependencies();
getElementForInheritedWidgetOfExactType: 不更新。
需要注意的點(diǎn): 這種傳遞方式是樹狀結(jié)構(gòu)從上而下進(jìn)行傳遞,所共享數(shù)據(jù)的頁面必須在頂層的build方法中,并且沒有延遲加載,比如這個(gè)頁面為動(dòng)態(tài)加載,那么在C頁面中的initState獲取數(shù)據(jù)就會(huì)報(bào)錯(cuò),原因就是首次構(gòu)建時(shí),沒有加載子頁面導(dǎo)致,可在build方法中獲取,或者延時(shí)獲取。
優(yōu)點(diǎn): 自上而下,無需一級(jí)一級(jí)傳遞,傳遞方便。
缺點(diǎn): 不能跨組件傳遞。
應(yīng)用場(chǎng)景: 系統(tǒng)中比如我們常見的MediaQuery設(shè)備信息和Theme應(yīng)用主題就是通過這種方式在來進(jìn)行統(tǒng)一數(shù)據(jù)共享的。
3、Notification
Notification是FLutter中的一種通知機(jī)制,和 InheritedWidget相反,他可以自下而上通知父組件更新數(shù)據(jù),
定義傳遞數(shù)據(jù)類:
class TestDataN extends Notification{
final String data;
TestDataN(this.data);
}
子組件通知調(diào)用dispacth方法通知父組件。
TestDataN("data").dispatch(context);
在父組件進(jìn)行監(jiān)聽:
NotificationListener(
onNotification: (data){
print("data$data");
return true;
},child: child);
應(yīng)用場(chǎng)景: 比如我們的ListView滾動(dòng)監(jiān)聽、就是通過Notification實(shí)現(xiàn)的。
4、Stream & event_bus
以上的2、3數(shù)據(jù)傳遞方式都是基于同一個(gè)widget樹進(jìn)行傳遞的,跨組件通信我們可以使用Stream事件流進(jìn)行傳遞,通過訂閱者模式監(jiān)聽數(shù)據(jù),可以在任意組件中進(jìn)行數(shù)據(jù)傳遞,event_bus插件就是使用這種方式來進(jìn)行數(shù)據(jù)傳遞的。
eventBus示例代碼:
// 創(chuàng)建公用對(duì)象
EventBus eventBus = EventBus();
// 監(jiān)聽數(shù)據(jù)
eventBus.on().listen((event) {
});
// 發(fā)送
eventBus.fire(event);
使用完畢在注冊(cè)接收數(shù)據(jù)頁面記得銷毀:eventBus.destroy();
優(yōu)點(diǎn): 可以跨組件通信。
到此這篇關(guān)于詳解Flutter中數(shù)據(jù)傳遞的方式的文章就介紹到這了,更多相關(guān)Flutter數(shù)據(jù)傳遞內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Android中實(shí)現(xiàn)EditText密碼顯示隱藏的方法
這篇文章主要介紹了Android中實(shí)現(xiàn)EditText密碼顯示隱藏的方法,需要的朋友可以參考下2017-01-01
Android Studio 3.6 正式版終于發(fā)布了,快來圍觀
Android Studio 3.6 正式版終于發(fā)布了,值得興奮呀,畢竟 3.5 大版本更新也已經(jīng)差不多半年了,撒花撒花!這次更新又更新了什么呢?快來跟隨小編一起看看吧2020-02-02
OKhttp攔截器實(shí)現(xiàn)實(shí)踐環(huán)節(jié)源碼解析
這篇文章主要為大家介紹了OKhttp攔截器實(shí)現(xiàn)實(shí)踐環(huán)節(jié)源碼解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-01-01
Android開發(fā)框架MVC-MVP-MVVM-MVI的演變Demo
這篇文章主要為大家介紹了Android開發(fā)框架MVC-MVP-MVVM-MVI的演變Demo,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-10-10
Android開發(fā)ListView中下拉刷新上拉加載及帶列的橫向滾動(dòng)實(shí)現(xiàn)方法
這篇文章主要介紹了Android開發(fā)ListView中下拉刷新上拉加載及帶列的橫向滾動(dòng)實(shí)現(xiàn)方法的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07
Android TabHost如何實(shí)現(xiàn)頂部選項(xiàng)卡
這篇文章主要介紹了Android TabHost如何實(shí)現(xiàn)頂部選項(xiàng)卡,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-09-09
Flutter懸浮按鈕FloatingActionButton使用詳解
本文主要介紹了Flutter懸浮按鈕FloatingActionButton使用,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-07-07

