国产又猛又爽又黄视频|在线观看人成视频免费|少妇高潮太爽了在线视频|911国产免费无码专区|特黄做受又大又粗又长大片|欧美一级二级免费在线观看|日日夜人人澡人人澡人人看免|欧洲午夜精品一级毛片在线播放

使用cover-view解決微信小程序地圖map等原生組件層級問題

2018-02-26 21:41 欄目:技術(shù)開發(fā) 查看(53280)

微信小程序的map、video、canvas、camera等組件都是原生組件,層級是最高的,并不能像原生開發(fā)那樣使用z-index來控制層級。

解決方法可以采用切換隱藏等方式來做,然而地圖組件如果采用這種方式來做就會變得不便。實(shí)際上從1.4.0基礎(chǔ)庫中增加了一個組件cover-view,用于在map、video、canvas、camera等原生組件上顯示基礎(chǔ)原生視圖。在去年9月份的時候,這個問題還在微信官方團(tuán)隊(duì)在長沙的分享會上介紹到的,并以摩拜單車小程序舉例。

252

具體可以參考官方文檔關(guān)于cover-view介紹,同時還有一個“孿生”的組件,就是cover-image,用于在cover-view中顯示圖片。

如下圖的小demo就是利用這些組件,其中地圖上的四個模塊(搜索框、定位按鈕、切換按鈕、個人中心入口)都是利用cover-view來構(gòu)造的。

微信圖片_20180225175405

需要注意的是,cover-view和cover-image這兩個組件僅能夠嵌套在map、video、canvas、camera等原生組件里面,雖然在1.9.0開始支持嵌套在view,但嵌套到view中不是它本身的意義了。

另外需要注意的是,這兩個組件css不是支持所有的屬性,只支持基本的定位、布局、文本樣式。不支持設(shè)置單邊的border、background-image、shadow、overflow等。

與我們的項(xiàng)目經(jīng)理聯(lián)系
掃二維碼與項(xiàng)目經(jīng)理溝通

我們在微信上24小時期待你的聲音

解答本文疑問/技術(shù)咨詢/運(yùn)營咨詢/技術(shù)建議/互聯(lián)網(wǎng)交流

轉(zhuǎn)載請注明出處:使用cover-view解決微信小程序地圖map等原生組件層級問題 - 微構(gòu)網(wǎng)絡(luò)
分享: