《HarmonyOS應(yīng)用開發(fā)基礎(chǔ)》 課件 實(shí)操 項(xiàng)目2-任務(wù)8 組件間的狀態(tài)管理

任務(wù)8組件間的狀態(tài)管理項(xiàng)目2走進(jìn)ArkTS聲明式開發(fā)任務(wù)8組件間的狀態(tài)管理本任務(wù)主要講解組件級(jí)別裝飾器的使用，并在父子組件間實(shí)現(xiàn)單向或雙向傳遞數(shù)據(jù)，跨子孫組件間實(shí)現(xiàn)雙向數(shù)據(jù)傳遞。任務(wù)描述任務(wù)效果圖預(yù)覽任務(wù)實(shí)施0102030504創(chuàng)建場(chǎng)景設(shè)置子組件父組件向子組件的@State變量傳值子組件用@Prop接收父組件的單向傳值跨子孫組件間雙向傳值子組件用@Link實(shí)現(xiàn)父子間雙向傳值01創(chuàng)建場(chǎng)景設(shè)置子組件

在ets目錄中新建目錄view，在view目錄中新建ArkTSFile文件，名為SceneInfo；在其中定義子組件SceneInfo，在子組件內(nèi)定義用@State裝飾的變量scene，用戶選擇不同的場(chǎng)景時(shí)，對(duì)應(yīng)的場(chǎng)景的背景和字體的顏色發(fā)生變化；定義子組件時(shí)用exportdefault進(jìn)行導(dǎo)出。02父組件向子組件的@State變量傳值在Index.ets中導(dǎo)入子組件SceneInfo，在build()中給Text組件添加事件來(lái)實(shí)現(xiàn)父組件的場(chǎng)景選擇，調(diào)用子組件SceneInfo時(shí)，使用this.scene_parent傳遞參數(shù)給子組件。03子組件用@Prop接收父組件的單向傳值修改子組件SceneInfo，用@Prop裝飾變量scene，@Prop裝飾的變量在子組件內(nèi)不能自己初始化；@Prop裝飾的變量必須使用其父組件提供的@State變量通過(guò)參數(shù)進(jìn)行初始化，修改父組件中調(diào)用子組件的位置，用({scene:this.scene_parent})給子組件傳值。04子組件用@Link實(shí)現(xiàn)父子間雙向傳值@Link裝飾的變量可以和父組件的@State變量建立雙向的數(shù)據(jù)綁定，@Link裝飾的變量必須使用其父組件提供的@State變量進(jìn)行初始化，并且使用$符號(hào)初始化，允許組件內(nèi)部修改@Link變量值且更改會(huì)通知給父組件。05跨子孫組件間雙向傳值修改SceneInfo子組件中的狀態(tài)變量為@Consume(“scene_val”)，修改父組件Index的狀態(tài)變量為@Provide(“scene_val”),在Index組件中調(diào)用子組件Provider_sub，實(shí)現(xiàn)Index組件通過(guò)Provider_sub子組件向SceneInfo孫組件傳值。任務(wù)8組件間的狀態(tài)管理本任務(wù)主要講解了組件級(jí)別的狀態(tài)變量裝飾器的使用，進(jìn)行了父子/子孫組件間的單向和雙向傳值，其中@State用在組件內(nèi)、@Prop用于父向子單向傳值、@Link用于父子間雙向傳值、@Provide用于跨子孫組件向@Consume