Flutter區域性狀態管理

2022-05-12 03:27:06 字數 3855 閱讀 9701

如前面所說, 它其實對子widget進行了一次包裝, 提供data, (proxywidget定義了如何包裝widget)

inheritedwidget > proxywidget > widget

在widget樹建立的時候, 會通過builderowner建立inheritedelement, 由inheritedelement來管理它的資料

同時提供了乙個方法用於確定是否需要更新子檢視, 具體邏輯由inheritedelement實現,inheritedelement繼承於element

inheritedelement createelement() => inheritedelement(this);

bool updateshouldnotify(covariant inheritedwidget oldwidget);

//子檢視向 `inheritedwidget` 中註冊監聽事件

class element)

_hadunsatisfieddependencies = true;

return null;

}

//承接上面的方法,在每次獲取資料的時候都會向當前的指定iheritedwidget(exacttype)註冊依賴,這樣每當這個inheritedwidget有資料更新時就會接收到通知。

@override

inheritedwidget dependoninheritedelement(inheritedelement ancestor, )

class inheritedelement extends proxyelement

//儲存對應的aspect,這個在inheritedelement中暫時用不到,預設都為null,是為了個inheritedmodel使用

final map_dependents = hashmap();

@protected

void setdependencies(element dependent, object value)

首先需要重建inheritedwidget, 重新修改它的data

class element 

//更新**element

class proxyelement extends componentelement

}class inheritedelement extends proxyelement

//通知子檢視重建

void notifydependent(covariant inheritedwidget oldwidget, element dependent)

//重寫 `proxyelement` ,決定是否需要更新

@override

void updated(inheritedwidget oldwidget)

}

關鍵點:_inheritedwidgets包含了所有的inheritedelement被訂閱者,_dependents包含了當前所有的訂閱者

abstract class inheritedmodelextends inheritedwidget

@protected

bool updateshouldnotifydependent(covariant inheritedmodeloldwidget, setdependencies);

class inheritedmodelelementextends inheritedelement

@override

void notifydependent(inheritedmodeloldwidget, element dependent)

}

import 'package:flutter/material.dart';

class inheritedwidgetdemo extends statefulwidget

class _inheritedwidgetdemostate extends state

@override

widget build(buildcontext context) );

},),

gesturedetector(

child: shareddatainheritedmodel(

first: bottomcount,

second: 2,

third: 3,

child: shareddatainheritedmodelcontainer(),

),ontap: ());

},),

],),

);} void ontap()

}class statelesswidgeta extends statelesswidget

}//// *****== inheritedwidget *****=== ////

class shareddatainheritedwidget extends inheritedwidget ) : super(child: child);

@override

bool updateshouldnotify(shareddatainheritedwidget oldwidget)

static shareddatainheritedwidget of(buildcontext context,

) }class shareddatainheritedwidgetcontainer extends statefulwidget

class _shareddatainheritedwidgetcontainer

extends state

@override

void didchangedependencies()

}//// *****== inheritedmodel ********** ////

enum sharedatadependent

class shareddatainheritedmodel extends inheritedmodel )

: super(child: child);

@override

bool updateshouldnotify(shareddatainheritedmodel oldwidget)

@override

bool updateshouldnotifydependent(

shareddatainheritedmodel oldwidget, set dependencies)

static shareddatainheritedmodel of(buildcontext context,

) }class shareddatainheritedmodelcontainer extends statelesswidget '),

text('2: $'),

text('3: $'),

],),

);}}

區域性狀態管管理主要通過了屬性傳值和遞迴查詢來完成的,利用了flutter狀態更新機制,通過對inheritedelements的查詢合適的widget取出對應的data,如果需要監聽改變再通過dependencies屬性查詢的執行notify方法去跟新它的依賴widget

Flutter狀態管理初探

本篇文章的主要內容是對flutter中狀態管理的方式及不同方式的選擇進行介紹。本文首發於我的個人部落格 技術公館 wcc.im flutter狀態管理初探 常見的狀態管理方式有三種,分別是由widget自身進行管理,由父widget進行管理和由widget自身及父widget混合進行管理。在對三種常...

Flutter 狀態管理 實踐記錄

flutter裡面最重要的應該就是 狀態管理剛開始做的乙個問題,statefulwidget的狀態應該被誰管理?widget本身?父widget?還是其他物件?以下是管理狀態的最常見的方法 舉個例子 比如 checkbox 裡面的資料到底是給誰管理比較方便 官方的原則是 因此,如果是checkbox...

Flutter 基礎元件 狀態管理

乙個永恆的主題,狀態 state 管理 無論是在react vue 兩者都是支援響應式程式設計的web開發框架 還是flutter中,他們討論的問題和解決的思想都是一致的。乙個問題,statefulwidget的狀態應該被誰管理?widget本身?父widget?都會?還是另乙個物件?答案是取決於實...