如何使用Mui实现通过js实现一个关闭上一个视图界面(webview)然后返回刷新上一视图界面和通过mui来实现右滑关闭功能代码的教程方法

如何使用Mui实现通过js实现一个关闭上一个视图界面(webview)然后返回刷新上一视图界面和通过mui来实现右滑关闭功能代码的教程方法

作者:张国军_Suger
开发工具与关键技术:HBuilder X、mui、JavaScript、安卓苹果手机
        由于需求需要我们完成可以实现用户打开A页面,打开B页面,然后再从B页面关闭然后返回到上一页面A页面,要实现返回到上一页面A页面刷新A页面的信息,也就是和实时更新差不多的功能。还有就是右滑关闭当前页面的功能实现,在此也给小伙伴们讲解一下,希望能帮到小伙伴。
B页面JavaScript方法语句代码视图:如何使用Mui实现通过js实现一个关闭上一个视图界面(webview)然后返回刷新上一视图界面和通过mui来实现右滑关闭功能代码的教程方法
B页面JavaScript方法语句代码展示:

$(function()
{
	mui.init({
		/********************右滑关闭*************************/
		swipeBack: true,
		beforeback: function() {
			/*************获得列表界面的webview*********************/
			var usercenter = plus.webview.currentWebview().opener();  
			/***触发列表界面的自定义事件(refresh),从而进行数据刷新***/
			mui.fire(usercenter, 'refresh');  
			/*********返回true,继续页面关闭逻辑********************/
			return true;  
		}  
	});
});

A页面JavaScript方法语句代码视图:
如何使用Mui实现通过js实现一个关闭上一个视图界面(webview)然后返回刷新上一视图界面和通过mui来实现右滑关闭功能代码的教程方法
A页面JavaScript方法语句代码展示:

/*******关闭上一页面后进行当前页面的刷新操作*******/
window.addEventListener("refresh", function(e) {
	window.location.reload();
});

        接下开我们来分析一下这两个视图的代码的含义:
        首先我们来分析一下B页面JavaScript方法语句代码视图,右滑关闭其实就一句话,只要记住就好。
        紧接着我们继续分析一下返回上一页面A页面的代码实现,我们需要获得界面的webview视图,然后再使用mui的方法触发列表界面的自定义事件(refresh),从而进行数据刷新,然后就是返回值的问题,我们需要返回true,继续页面关闭逻辑操作。
        紧到我们再来分析一下A页面JavaScript方法语句代码视图,先来说一下addEventListener()的方法, addEventListener()方法是用于向指定元素添加事件句柄。然后我们需要添加的事件是刷新事件(refresh),方法里面在来写我们的刷新代码,整个方法就是关闭上一页面后进行刷新当前页面的刷新操作。
        综上所述得,我们就这样通过两个方法就能实现了Mui通过js实现关闭上一个视图界面(webview)返回刷新上一视图界面和右滑关闭功能代码了。