uniAPP微信小程序通過webview跳轉到其他網址

最近一段時間在用uniAPP框架做小程序時遇到了很多坑，所以記錄一下遇到的問題。

注意：目前通過webview跳轉到其他網址支持：
1、與微信小程序綁定的微信公衆號文章地址;
2、在微信小程序後臺配置好業務域名的地址。

1、新建一個只有webview組件的頁面

linkOthers:

<template>
	<view>
		<view>
			<!-- url爲要跳轉外鏈的地址-->
		    <web-view :src="url">
		    </web-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url:""
			}
		},
		onLoad(val) {
			this.url = decodeURIComponent(val.url);
			// 設置當前的title 如果外鏈中有的話將被覆蓋
			if(this.isNotEmpty(val.title)){
				this.setTitle(val.title);
			}
		},
		methods: {
			isNotEmpty(obj) {
				if (typeof obj == undefined || obj == null || obj == "" || obj == "undefined" || obj.length == 0) {
					return false;
				} else {
					return true;
				}
			},
			// 設置title
			setTitle(title) {
				uni.setNavigationBarTitle({
					title: title
				})
			},
		}
	}
</script>

二、觸發跳轉

<template>
	<view>
		<button @click="linkOthers()"></button>
	</view>
</template>
<script>
	export default {
		methods: {
			linkOthers(){
				// 此處填寫你要跳轉的綁定公衆號文章的鏈接地址或者已經在小程序後臺配置好業務域名的地址
				var url = "https://www.baidu.com";	
				uni.navigateTo({
					// 此處的鏈接爲小程序上面新建的webview頁面路徑，參數url爲要跳轉外鏈的地址
					url:"/pages/common/linkOthers/linkOthers?url=" + encodeURIComponent(url）
				});
			}
		}
	}
</script>