uniapp webview 加載H5,手機返回鍵處理成返回上一頁,上一個網頁


加webview的vue相關處寫如下加紅代碼

 

 

<script>
const facebook = uni.requireNativePlugin('sn-facebook');
var wv; //計划創建的webview
export default {
	data() {
		return {
			canBack: false
		};
	},
	onLoad() {},
	onBackPress() {
		if (wv && this.canBack) {
			wv.back();
			return true;
		}
		return false;
	},
	onReady() {
		// #ifdef APP-PLUS
		var self = this;
		var currentWebview = this.$scope.$getAppWebview(); //此對象相當於html5plus里的plus.webview.currentWebview()。在uni-app里vue頁面直接使用plus.webview.currentWebview()無效,非v3編譯模式使用this.$mp.page.$getAppWebview()
		setTimeout(function() {
			wv = currentWebview.children()[0];
			wv.addEventListener(
				'progressChanged',
				function(e) {
					wv.canBack(function(e) {
						self.canBack = e.canBack;
					});
				},
				false
			);
		}, 500); //如果是頁面初始化調用時,需要延時一下
		// #endif
	},
	methods: {
		onMessage({ detail }) {
			const data = detail.data[0];
			console.log('onMessage', data);
			if (data.action == 'login') {
				// 登錄:自定義參數
				facebook.loginWithParams(
					{
						permissions: [
							// 權限,更多權限請看 https://developers.facebook.com/docs/permissions/reference
							'email',
							'public_profile'
						],
						// 返回字段,更多字段請查看 https://developers.facebook.com/docs/graph-api/reference/user/
						fields: 'id, name, email'
					},
					e => {
						console.log(e);
						this.postMessage({ ...e, action: 'loginCallback' });
					}
				);
			}
		},
		// postMessage to web
		postMessage(data) {
			if (wv) {
				wv.evalJS('window.postMessage(' + JSON.stringify(data) + ');');
			} else {
				uni.showToast({
					icon: 'none',
					title: 'webview不存在'
				});
			}
		}
	}
};
</script>

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM