uniapp map層級太高，樣式支持度不高 使用nvue解決

在pages.json里面配置，使用subNVues

 

{
            "path": "pages/appointmentRecovery/record/detail",
            "style": {
                "navigationBarTitleText": "預約詳情",
                "app-plus": {
                    "subNVues": [{
                        "id": "recordInfo", // 唯一標識  
                        "path": "/pages/appointmentRecovery/record/info", // 頁面路徑  
                        // "type": "popup", //原生子窗口內置樣式，可取值：'popup',彈出層；"navigationBar",導航欄
                        "style": {
                            "position": "absolute",
                            "bottom": "100upx",
                            "width": "100%",
                            "height": "50%",
                            "mask": "rgba(0,0,0,0)",
                            "style": {
                                "popGesture": "none" // 組織側滑返回, none,close
                            }
                        }
                    },{
                        "id": "recordMap", // 唯一標識  
                        "path": "/pages/appointmentRecovery/record/map", // 頁面路徑  
                        // "type": "popup", //原生子窗口內置樣式，可取值：'popup',彈出層；"navigationBar",導航欄
                        "style": {
                            "position": "absolute",
                            "top": "0upx",
                            "left": 0,
                            "width": "100%",
                            "height": "50%",
                            "mask": "rgba(0,0,0,0)",
                            "style": {
                                "popGesture": "none" // 組織側滑返回, none,close
                            }
                        }
                    }]
                }
            }
        },

在父頁面

// 根據id獲取聲明好的子頁面
this.subNvueMap = uni.getSubNVueById('recordMap');
// 設置子頁面的大小
this.subNvueMap.setStyle({
                height: '50%'
            });
// 向子頁面傳參數
uni.$emit('to-modal1', JSON.stringify(obj));
// 通知子頁面以什么形式顯示
this.subNvueMap.show('slide-in-bottom', time, ()     
      => {
    console.log('顯示subNvueMap');
}); // 顯示

子頁面

// 子頁面是以.nvue結尾的文件
// 在created聲明周期中接收父頁面的傳參

uni.$on('to-modal1', data => {
    console.log('父組件傳遞給子組件的值', this.formData);
});

// 在beforeDestroy生命周期銷毀監聽
uni.$off('to-modal1');