在Flutter中，常見的數(shù)據(jù)傳遞一共有以下幾種：

1、構(gòu)造方法傳遞

Flutter的構(gòu)造方法具備著dart語言的特點，參數(shù)具備可選狀態(tài)，通過構(gòu)造方法傳遞數(shù)據(jù)，可以很方便的將任意數(shù)據(jù)進行傳遞，平時開發(fā)中，A跳轉(zhuǎn)B頁面最常用的方法就是通過構(gòu)造方法進行傳遞。比如我們最常見的Key就是通過構(gòu)造一級一級向下傳遞的。

優(yōu)點： 相鄰頁面之間傳遞數(shù)據(jù)非常方便，你不需要進行任何額外的操作。

缺點： 當頁面層級過多以及類過多時，需一級一級傳遞，寫起來非常麻煩，代碼耦合性高。

2、InheritedWidget

為了解決構(gòu)造函數(shù)一級一級鄉(xiāng)下傳遞的的缺點，F(xiàn)lutter派生出了功能性組件InheritedWidget，通過它可以實現(xiàn)頂級widget的數(shù)據(jù)共享，也就是說無需一級一級向下傳遞，即可獲取數(shù)據(jù)，比如A頁面有一個數(shù)據(jù)，需要在C頁面使用，那么就可以不經(jīng)過B頁面獲取，前提ABC三個頁面是屬于一個Widget中的，常見的 TabView布局頂層數(shù)據(jù)共享，適合復(fù)雜頁面頂層向下傳遞數(shù)據(jù)，使用也很簡單。

示例代碼：

/// 數(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);

/// 定義一個靜態(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: 不更新。

需要注意的點： 這種傳遞方式是樹狀結(jié)構(gòu)從上而下進行傳遞，所共享數(shù)據(jù)的頁面必須在頂層的build方法中，并且沒有延遲加載，比如這個頁面為動態(tài)加載，那么在C頁面中的initState獲取數(shù)據(jù)就會報錯，原因就是首次構(gòu)建時，沒有加載子頁面導(dǎo)致，可在build方法中獲取，或者延時獲取。

優(yōu)點： 自上而下，無需一級一級傳遞，傳遞方便。

缺點： 不能跨組件傳遞。

應(yīng)用場景： 系統(tǒng)中比如我們常見的MediaQuery設(shè)備信息和Theme應(yīng)用主題就是通過這種方式在來進行統(tǒng)一數(shù)據(jù)共享的。

3、Notification

Notification是FLutter中的一種通知機制，和 InheritedWidget相反，他可以自下而上通知父組件更新數(shù)據(jù)，

定義傳遞數(shù)據(jù)類：

class TestDataN extends Notification{
  final String data;
  TestDataN(this.data);
}

子組件通知調(diào)用dispacth方法通知父組件。

TestDataN("data").dispatch(context);

在父組件進行監(jiān)聽:

NotificationListener(
    onNotification: (data){
      print("data$data");
  return true;
},child: child);

應(yīng)用場景： 比如我們的ListView滾動監(jiān)聽、就是通過Notification實現(xiàn)的。

4、Stream & event_bus

以上的2、3數(shù)據(jù)傳遞方式都是基于同一個widget樹進行傳遞的，跨組件通信我們可以使用Stream事件流進行傳遞，通過訂閱者模式監(jiān)聽數(shù)據(jù)，可以在任意組件中進行數(shù)據(jù)傳遞，event_bus插件就是使用這種方式來進行數(shù)據(jù)傳遞的。

eventBus示例代碼:

// 創(chuàng)建公用對象
EventBus eventBus = EventBus();
// 監(jiān)聽數(shù)據(jù)
eventBus.on().listen((event) {

});
// 發(fā)送
eventBus.fire(event);

使用完畢在注冊接收數(shù)據(jù)頁面記得銷毀:eventBus.destroy();

優(yōu)點： 可以跨組件通信。

到此這篇關(guān)于詳解Flutter中數(shù)據(jù)傳遞的方式的文章就介紹到這了,更多相關(guān)Flutter數(shù)據(jù)傳遞內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論