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

1 篇文章 0 订阅
1 篇文章 0 订阅

注意:目前通过webview跳转到其他网址支持:
1、与微信小程序绑定的微信公众号文章地址;
2、在微信小程序后台配置好业务域名的地址。

1、新建一个只有webview组件的页面

<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/webView/webView?url=' + encodeURIComponent(url) + '&title=关注公众号'
                });
            }
        }
    }
</script>
  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值