解决OnsenUI单页面应用物理回退问题

物理回退，指通过手机按键中的“回退”键实现页面后退功能。在onsenUI单页面应用开发中，由于url地址无变化，导致点击“回退”键直接退出微信内置浏览器（解决方法适用于浏览器、app、微信），那如何解决SPA中的物理回退问题呢？window.location.hash，通过创建监听事件postpush（页面加载之后），修改url链接中的hash值，使url地址发生变化（由于hash值为#值，不影响微信JS-SDK授权）从而解决回退问题，以onsenUI为例，示例代码如下：

//调用回退
	setImmediate(function () {parseHashChange(mainNavi)});
	/**
	* 物理回退
	* @param mainNavi
	*/
	function parseHashChange(mainNavi){
		if(!mainNavi) return;
		mainNavi.on('postpush',function(event) {
		    //监听push后事件
		    //{index: 3,page: "../www/login/login.html"}
		    var pages = event.navigator.pages;
		    var pageName = event.enterPage.page;
		    console.log("pages:",pages);
		    console.log("pageName:",pageName);
		    var hash = {index:pages?pages.length:0,page:pageName};
		    console.log("hash:",hash);
		    window.location.hash = window.btoa(angular.toJson(hash));
		});
		mainNavi.on('prepush',function(event) {
		    //监听push之前的事件，
		});
		mainNavi.on('prepop',function(event) {
		    //监听pop之前的事件
		});
		mainNavi.on('postpop',function(event) {
		    //监听pop之后的事件
		});
		angular.element(window).on('hashchange',function(event){
		    //监听hashchange事件
		});
	}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!