uniapp开发小程序：使用webview 跳转外部链接

一、使用uniapp开发小程序时，要跳转外部链接，实现的效果如下：

二、实现的步骤：

①先在自己uniapp项目pages.json中建一个页面webview.vue

{"path" : "pages/webview/webview","style" :                                                                                    {"navigationBarTitleText": "","enablePullDownRefresh": false}
}

②页面webview.vue中的全部代码如下：

<template><web-view :src="url"></web-view>
</template><script>export default {data() {return {url: ''}},onLoad(e) {// 传入需要跳转的链接 使用web-view标签进行跳转this.url = decodeURIComponent(e.url)// console.log(this.url)}}
</script>

③在需要操作的页面，通过点击事件触发跳转

<template><view @click="mycat()">点击跳转</view>
</template><script>//跳转外部链接mycat() {let url = 'https://www.baidu.com/'// 填写要跳转的链接 uni.navigateTo({url: '/pages/webview/webview?url=' + url// page.json定义的路径 传url到webview界面去接收-实现跳转})
},
</script>

到这里的完成啦~okk