HarmonyOS開發(fā)之LocalStorage

LocalStorage是頁面級的UI狀態(tài)存儲退唠,頁面組件(組件樹根節(jié)點(diǎn))獲取LocalStorage是通過@Entry裝飾器接收的參數(shù)傳入,子組件自動獲取LocalStorage的訪問權(quán)限误甚,獲取的也是通過@Entry傳入的LocalStorage。頁面內(nèi)共享同一個LocalStorage實(shí)例谱净。支持一個UIAbility內(nèi)多個頁面間共享一個LocalStorage窑邦。getShared僅能獲取當(dāng)前Stage通過UIAbility中windonStage.loadcontent傳入的LocalStorage

不與自定義組件進(jìn)行關(guān)聯(lián)的使用場景:

LocalStorage若是想要跟自定義組件建立聯(lián)系,需要使用裝飾器:@LocalStorageProp和@LocalStorageLink

一壕探、@LocalStorageProp:此裝飾器裝飾的變量與LocalStorage中key對應(yīng)的屬性建立單向同步關(guān)系

示例:@LocalStorageProp(key) name:string = ‘’冈钦;

裝飾的變量需要初始化,因?yàn)榇薻ey(常量字符串)可能沒值李请。另外不能通過父組件傳值賦值瞧筛,只能通過LocalStorage中的key初始化,若沒有對應(yīng)key导盅,用默認(rèn)值初始化较幌,并將值存入LocalStorage中,注意:此時是存入白翻,不是同步乍炉。

支持初始化子節(jié)點(diǎn),可用于初始化子節(jié)點(diǎn)的@State 滤馍、@Prop岛琼、@Link、@Provide狀態(tài)變量

只能在組件內(nèi)訪問纪蜒,不支持在組件外部訪問

同步類型:數(shù)據(jù)單向同步衷恭。

框架行為:

1、被@LocalStorageProp裝飾的變量值改變時纯续,不會同步會回LocalStorage中随珠,但會驅(qū)動對應(yīng)的UI組件刷新渲染.

2灭袁、若是LocalStorage(key)的值發(fā)生改變,那么所有@LocalStorageProp(key)裝飾的變量都會發(fā)生改變窗看,并且覆蓋其本地的改變茸歧。

示例1:

示例1

示例1中:

1、點(diǎn)擊name1显沈,name1值改為‘value change’软瞎,驅(qū)動name1顯示內(nèi)容改變,不會同步給LocalStorage拉讯,所以name2顯示內(nèi)容不變涤浇。

2、點(diǎn)擊name2魔慷,會改變LocalStorage中name對應(yīng)的值只锭,單向同步給name1。改為'keke'

二院尔、@LocalStorageLink:此裝飾器裝飾的變量與LocalStorage中key對應(yīng)的屬性建立雙向同步關(guān)系

示例:@LocalStorageLink(key)? age:number:= 11蜻展;

裝飾的變量需要初始化,因?yàn)榇薻ey可能沒值邀摆。同樣不能通過父組件傳值賦值纵顾,只能通過LocalStorage中的key初始化。若沒有對應(yīng)的key栋盹,用默認(rèn)值初始化施逾,并存入LocalStorage中。

支持初始化子節(jié)點(diǎn)贞盯,可用于初始化子節(jié)點(diǎn)的@State音念、@Prop沪饺、@Link躏敢、@Provide狀態(tài)變量

同樣只能在組件內(nèi)訪問,不支持在組件外部訪問

@LocalStorageLink(key)和LocalStorage中key對應(yīng)的值會建立數(shù)據(jù)雙向同步整葡。

本地變量age改變件余,會把值同步回LocalStorage中key對應(yīng)的值,同樣LocalStorage中key對應(yīng)的值改變遭居,也會把值同步到本地變量age啼器。即:把a(bǔ)ge的新值同步回LocalStorage中key對應(yīng)的值,同樣LocalStorage中key對應(yīng)的值發(fā)生改變俱萍,本地變量age的值也發(fā)生同步改變端壳。

同步類型:雙向同步。

框架行為:

當(dāng)@LocalStorageLink(key)裝飾的的變量發(fā)生改變時枪蘑,會把修改的結(jié)果值同步回LocalStorage中key對應(yīng)的屬性值损谦。

當(dāng)LocalStorage中的key對應(yīng)的屬性值發(fā)生改變時岖免,會把改變的結(jié)果值同步到所有key綁定的數(shù)據(jù)上面(包括LocalStorageLink(key)和LocalStorageProp裝飾的變量。

當(dāng)@LocalStorageLink(key)裝飾的變量發(fā)生該改變時照捡,在同步數(shù)據(jù)回LocalStorage中的同時颅湘,還會驅(qū)動與其綁定的UI組件進(jìn)行刷新渲染

示例2:

示例2中:

1、點(diǎn)擊name1栗精,name1值改為‘value change’闯参,驅(qū)動name1顯示內(nèi)容改變,同時會同步給LocalStorage悲立,所以name2顯示內(nèi)容對應(yīng)的不是狀態(tài)變量鹿寨,所以顯示內(nèi)容不會改變,但LocalStorage的值改變會同步給所有綁定了對應(yīng)key的數(shù)據(jù)薪夕,所以name3也會改變释移,并驅(qū)動name3的UI刷新渲染。

2寥殖、點(diǎn)擊name2玩讳,會改變LocalStorage中name對應(yīng)的值,會同步給name1和name3嚼贡。均改為'keke'熏纯,同時驅(qū)動name1和name3組件UI重新渲染

示例代碼3:若LocaStorage中沒有對應(yīng)的key,用默認(rèn)值初始化粤策,并將值存入LocalStorage中樟澜,下次通過key取的值是LocalStorage中的值,而不是新的默認(rèn)值

下面示例3是針對初始值而言:

示例 3

示例3中叮盘,因?yàn)橐婚_始LocalStorage中沒有name鍵秩贰,?value1在使用默認(rèn)值123初始化的時候,也把值存到了存到LocalStorage中name對應(yīng)的屬性值上面柔吼,所以當(dāng)value2是優(yōu)先用LocalStorage中name對應(yīng)的值來初始化的毒费,所以還是123。用@LocalStorageLink('name')同樣如此愈魏。


Ability內(nèi)多個頁面共享的示例如下:

1觅玻、在當(dāng)前Ability中的windowStage.loadConent傳入LocalStorage

來源

2、在組件入口處通過getShare獲取培漏,并通過@Entry傳入

取值
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末溪厘,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子牌柄,更是在濱河造成了極大的恐慌畸悬,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,639評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件珊佣,死亡現(xiàn)場離奇詭異蹋宦,居然都是意外死亡闺骚,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3 385
  • 文/潘曉璐 我一進(jìn)店門妆档,熙熙樓的掌柜王于貴愁眉苦臉地迎上來僻爽,“玉大人,你說我怎么就攤上這事贾惦⌒匕穑” “怎么了?”我有些...
    開封第一講書人閱讀 157,221評論 0 348
  • 文/不壞的土叔 我叫張陵须板,是天一觀的道長碰镜。 經(jīng)常有香客問我,道長习瑰,這世上最難降的妖魔是什么绪颖? 我笑而不...
    開封第一講書人閱讀 56,474評論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮甜奄,結(jié)果婚禮上柠横,老公的妹妹穿的比我還像新娘。我一直安慰自己课兄,他們只是感情好牍氛,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,570評論 6 386
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著烟阐,像睡著了一般搬俊。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蜒茄,一...
    開封第一講書人閱讀 49,816評論 1 290
  • 那天唉擂,我揣著相機(jī)與錄音,去河邊找鬼檀葛。 笑死玩祟,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的驻谆。 我是一名探鬼主播卵凑,決...
    沈念sama閱讀 38,957評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼庆聘,長吁一口氣:“原來是場噩夢啊……” “哼胜臊!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起伙判,我...
    開封第一講書人閱讀 37,718評論 0 266
  • 序言:老撾萬榮一對情侶失蹤象对,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后宴抚,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體勒魔,經(jīng)...
    沈念sama閱讀 44,176評論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡甫煞,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,511評論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了冠绢。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片抚吠。...
    茶點(diǎn)故事閱讀 38,646評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖弟胀,靈堂內(nèi)的尸體忽然破棺而出楷力,到底是詐尸還是另有隱情,我是刑警寧澤孵户,帶...
    沈念sama閱讀 34,322評論 4 330
  • 正文 年R本政府宣布萧朝,位于F島的核電站,受9級特大地震影響夏哭,放射性物質(zhì)發(fā)生泄漏检柬。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,934評論 3 313
  • 文/蒙蒙 一竖配、第九天 我趴在偏房一處隱蔽的房頂上張望何址。 院中可真熱鬧,春花似錦进胯、人聲如沸头朱。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽项钮。三九已至,卻和暖如春希停,著一層夾襖步出監(jiān)牢的瞬間烁巫,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1 266
  • 我被黑心中介騙來泰國打工宠能, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留亚隙,地道東北人。 一個月前我還...
    沈念sama閱讀 46,358評論 2 360
  • 正文 我出身青樓违崇,卻偏偏與公主長得像阿弃,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子羞延,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,514評論 2 348

推薦閱讀更多精彩內(nèi)容