微信小程式 map元件z index無效

2022-04-03 21:15:11 字數 824 閱讀 4832

查小程式官方文件,官方文件表示,map元件層級最高無法用z-index控制。這就很難受了。

那我一定要在地圖上放東西怎麼辦,官方給出解決辦法是

1. controls,但是controls的本質就是一張,無法滿足多樣化的需求(controls即將廢棄,請使用 cover-view)

2.cover-view,覆蓋在原生元件之上的文字檢視,可覆蓋的原生元件包括map、video、canvas、camera、live-player、live-pusher,但是cover-view只支援巢狀cover-view、cover-image,button。所以同樣無法滿足多樣化需求。

這樣官方給出的解決方法就是然並卵。

那我們用第三方地圖唄,然鵝目前小程式內不支援使用第三方地圖。

但是我們可以用第三方地圖的api,所以委曲求全一下,檢視高德地圖小程式api可以根據經緯度生成靜態的,我們可以將這個作為背景。

效果如下:

微信小程式元件

class屬性 可以設定樣式,如果與動態資料繫結結合,元件的class具有動態變化的能力 style 通過style設定元件的內聯樣式,style屬性值中可以設定css的各種屬性 hidden 預設為false,不隱藏 data 屬性 可以用來為元件設定任意的自定義的屬性值,當元件繫結的事件觸發時,...

微信小程式 元件

官方文件見 我們的封裝 var basecomponentoption require utils basecomponentoption var option basecomponentoption.init 最小值限制 min 最大值 max 當前值 value 傳參物件,和 官方文件一致,只是...

微信小程式 Tabs元件

如果想要個性的話,可以自己修改了。這次是寫乙個tabs的元件,根據不同的狀態,回來切換操作,標記一下,先看一下效果圖 獲取,試例裡用匯入的引用,都可以從github裡找到。tabs.wxss 檔案.tabscss tabscss tab tabscss last child tabscss tab ...