uni-app 解决video组件层级过高的问题

使用video组件时，弹出框总是在video下方。

需要的效果如图：

解决方法：

使用subNvue子窗体：

1。在使用video组件的页面同级建立一个子目录subNVue，创建一个DialogNet.nvue页面，

2。在page.json文件中配置subNVues,

                {
			"path": "pages/netcheck/NetCheckList",
			"style": {
				"navigationBarTitleText": "远程巡店",
				"enablePullDownRefresh":true,
				"app-plus": {
					"pullToRefresh": {
						"style":"circle",
						"offset": "88px"
					},
					"subNVues":[{  
						"id": "netDialog", // 唯一标识  
						"path": "pages/netcheck/subNVue/DialogNet", // 页面路径  
						"type": "popup",  //原生子窗口内置样式，可取值：'popup',弹出层；"navigationBar",导航栏
						"style": {  
							"position":"fixed",
							"background":"transparent"
						}  
					}]  
				}
			}
		},

 3。显示子窗体

const subNvue = uni.getSubNVueById('netDialog');
subNvue.show();

4。关闭子窗体，在弹出的子窗体上点击关闭按钮或确定按钮关闭窗体

const subNvue = uni.getSubNVueById('netDialog');
subNvue.hide();

5。在.nvue页面获取input输入框的值：

onKeyInput(event) {
    this.userName = event.detail.value;
    this.selectCondition['nickName'] = this.userName;
},

6。向video页面传值：点击“确定”按钮，将获取到的input中的值，传到vue页面：

btnTaped(item) {
    console.log(item);
    if(item.text == '重置') {
        this.userName = '';
        this.selectCondition = {};
    } else {
        uni.$emit('receiveData',this.selectCondition);
	this.close();
    }
},

7。vue页面接收nvue的传值

onLoad() {
    uni.$on('receiveData',(options)=>{
    console.log('onLoad====receiveData',JSON.stringify(options));
    this.searchCondition = options;
    })
},

整体代码：

代码中包含的知识点：

1。上拉加载（自定义了错误处理）

2。下拉刷新

3。使用subNVue子窗体，解决video层级高的问题

4。vue与nvue之间的通讯；