uniapp原生子窗体subnvue(弹出层确认取消)

uniapp原生子窗体subnvue(弹出层确认取消)_第1张图片

 目录结构

uniapp原生子窗体subnvue(弹出层确认取消)_第2张图片

 nvue代码






pages.json引用

{
			"path": "pages/fabu/fabu",
			"style": {
				"navigationBarBackgroundColor": "#FFFFFF",
					// "app-plus": {
					// 	"titleNView": false //禁用原生导航栏
					// },
				"navigationBarTitleText": "发布",
				"enablePullDownRefresh": false,
				"app-plus": {
					"subNVues": [{
						"id": "modal", // 唯一标识  
						// "path": "platform/app-plus/subNVue/testSubNVue", // 页面路径  
						"path": "pages/fabu/modalSubNVue", // 页面路径  
						"type": "popup",
						"style": {
							"position": "dock", //除 popup 外,其他值域参考 5+ webview position 文档
							"margin":"auto",
							"background":"transparent"
						}
					}]
				}
			}

		}

index页面使用

SubNvue() {
				// #ifdef APP-PLUS


				let subNVue
				try {
					subNVue = uni.getSubNVueById('modal')
				} catch (e) {}
				if (!subNVue) {
					this.$showToast('仅App端支持,且pages.json已配置')
					return
				}
				// 打开 nvue 子窗体  
				modalProp.set({
					content: '当前内容不为空,是否清空',
					title: '提示',
				})
				uni.$once('downPop', () => {
					console.log("modalProp", modalProp);
				})
				const data = modalProp.get()
				uni.$emit('setPop', data)
				subNVue.show('zoom-fade-out', 300, function() {
					// 打开后进行一些操作...  
					console.log('打开了?');
				});
				// 关闭 nvue 子窗体  
				// subNVue.hide('fade-out', 300)
				// #endif
			},
// 弹出层做的操作
			subNames() {

				if (this.msg == "确定") {
					console.log('点击了确认')
					this.src = ''
					this.content = ''
					// 清除list集合中的所有数据
					this.imageList.splice(0, this.imageList.length)
					const subNVue = uni.getSubNVueById('modal')
					// 关闭弹窗
					subNVue.hide('none', 300)
				}
				if (this.msg == "取消") {
					console.log('点击了取消')
					const subNVue = uni.getSubNVueById('modal')
					// 关闭弹窗
					subNVue.hide('none', 300)
				}

			}

页面监听

onLoad() {
			//const self = this;
			uni.$on('page-popup', (data) => {
				this.msg = data.msg;

				console.log(data)
				this.subNames()
				console.log("信息", this.msg)
			});
			
		},
		onUnload() {
			//移除监听
			uni.$off('page-popup')
		},

你可能感兴趣的:(uni-app)