问题描述
参照官网在<map>
标签里嵌套使用<cover-view>
,在浏览器调试(包括微信小程序)可以正常使用,但是在手机APP调试时无法正常显示,一顿百度之后找到原因是vue页面的地图会默认置位最顶层,甚至连导航栏都会覆盖掉,而<cover-view>
只适用于小程序且修改z-index
也不管用。有的资料说使用nvue页面代替vue页面可以实现,但是nvue页面局限太大,很多东西都无法使用,如导入的ColorUI、onload时获取组件高度宽度甚至api在手机app中都无法调用,因此并不想把写好的整个页面都重写。然后发现了 原生子窗体subNVue,只需要将需要的组件写成nvue页面,以一个原生的popup弹出组件,省去了不少烦恼和工作量。
解决方案
将组件单独写成nvue页面并使用
step1:配置页面
修改page.json文件,添加nvue页面的路径,如:
{
"pages": [{
"path": "pages/map/map", // 地图目录
"style": {