在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
? ? ? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? }]
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? },
在父頁面
// 根據(jù)id獲取聲明好的子頁面
this.subNvueMap = uni.getSubNVueById('recordMap');
// 設置子頁面的大小
this.subNvueMap.setStyle({ height: '50%' });
// 向子頁面?zhèn)鲄?shù)
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); });
// 子頁面給父頁面?zhèn)鲄?/p>
uni.$emit('modal-change1', '我是傳遞給父組件的值');
// 在beforeDestroy生命周期銷毀監(jiān)聽
uni.$off('to-modal1');