鴻蒙的商品購物車和參數傳遞過程當中的注意事項

首先謝謝你們對花妖的支持,也感謝那些給花妖提建議和鼓勵的人們,花妖將繼續努力,將更多的做品呈現給你們。數組

        今天簡單整理在鴻蒙商城購物車和參數傳的過程當中容易出錯的小細節。花妖以茶葉爲主題,作一個茶葉店鋪的購物車。老規矩,上圖:ide

圖一:下圖爲購物車的總體視圖佈局

鴻蒙的商品購物車和參數傳遞過程當中的注意事項        在作購物車圖標的時候,花妖先嚐試了一下啓用display佈局,而後居中,這樣作雖然能讓購物車圖標精確的居中,可是後期的添加商品數量小標誌的視效果就很難看。spa

        圖二:添加商品數量小標誌樣式中加上position:absolute;樣式能夠變回來,可是位置也被居中了,不符合客戶日常使用習慣。鴻蒙的商品購物車和參數傳遞過程當中的注意事項orm

圖3、棄用以前購物車的display佈局,也加上position:absolute佈局樣式鴻蒙的商品購物車和參數傳遞過程當中的注意事項視頻

        這裏花妖通過屢次嘗試,X座標給300px正好符合居中標準。再將添加商品數量標記再移動70px左右就大功告成了。blog

圖4、圖五:如何實現添加商品參數在初始值時隱藏效果?ci

鴻蒙的商品購物車和參數傳遞過程當中的注意事項鴻蒙的商品購物車和參數傳遞過程當中的注意事項        利用三元運算方法設置參數初始值爲0,再利用index下標相加>0的方法,就能夠實現初始時添加商品參數隱藏的效果。get

圖6、++表示當前的值加1,設置用戶的購物車商品記錄方式和跳轉頁面帶參數(shoppingcar)鴻蒙的商品購物車和參數傳遞過程當中的注意事項it

圖7、新建接收跳轉數據的頁面,接收數據參數和傳送數據參數要相一致(shoppingcar)

鴻蒙的商品購物車和參數傳遞過程當中的注意事項        接下來只要把接收頁面和傳送頁面同樣作一個<block>數組循環加樣式修飾就能夠了。

 

視頻連接:https://harmonyos.51cto.com/show/2990,你們能夠點擊連接直接前往


想了解更多關於鴻蒙的內容,請訪問:

51CTO和華爲官方戰略合做共建的鴻蒙技術社區

https://harmonyos.51cto.com/#bkwz

相關文章
相關標籤/搜索