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

 

 1 {
 2             "path": "pages/appointmentRecovery/record/detail",
 3             "style": {
 4                 "navigationBarTitleText": "预约详情",
 5                 "app-plus": {
 6                     "subNVues": [{
 7                         "id": "recordInfo", // 唯一标识  
 8                         "path": "/pages/appointmentRecovery/record/info", // 页面路径  
 9                         // "type": "popup", //原生子窗口内置样式,可取值:'popup',弹出层;"navigationBar",导航栏
10                         "style": {
11                             "position": "absolute",
12                             "bottom": "100upx",
13                             "width": "100%",
14                             "height": "50%",
15                             "mask": "rgba(0,0,0,0)",
16                             "style": {
17                                 "popGesture": "none" // 组织侧滑返回, none,close
18                             }
19                         }
20                     },{
21                         "id": "recordMap", // 唯一标识  
22                         "path": "/pages/appointmentRecovery/record/map", // 页面路径  
23                         // "type": "popup", //原生子窗口内置样式,可取值:'popup',弹出层;"navigationBar",导航栏
24                         "style": {
25                             "position": "absolute",
26                             "top": "0upx",
27                             "left": 0,
28                             "width": "100%",
29                             "height": "50%",
30                             "mask": "rgba(0,0,0,0)",
31                             "style": {
32                                 "popGesture": "none" // 组织侧滑返回, none,close
33                             }
34                         }
35                     }]
36                 }
37             }
38         },

在父页面

// 根据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');