首页 > 微信 > 详细

uniAPP微信小程序通过webview跳转到其他网址

时间:2021-01-07 15:42:59      阅读:185      评论:0      收藏:0      [点我收藏+]

注意:目前通过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>

  来源:https://blog.csdn.net/weixin_44379204/article/details/106648979?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-1.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-1.control

uniAPP微信小程序通过webview跳转到其他网址

原文:https://www.cnblogs.com/mmy67/p/14246770.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!