需求:

需求是小程序的首页banner图来自pc端配置生产。

小程序点击轮播的banner图后,跳到对应的linkurl,但是我们和客户约定好,只能跳转公众号。

一开始看了小程序的文档,需要配置什么业务域名,下载校验文件,其实不需要。只需要一个webview页面即可。

实现:

 

跳转之后:

具体步骤:

1.首先创建要一个webview的文件夹

 代码如下:

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

2.在业务点击按钮层面直接跳转传入url:

注意:公众号链接可以打开你的公众号文章,然后点击右上角,再点击复制链接就可以了,一般我们都是和用户约定好,只能配置公众号文章,所以我们是动态跳转至用户配置的url;

skipLink(e) {
   // 你的公众号链接
   let url = 'https://mp.weixin.qq.com/s/xxxxxxx';
   uni.navigateTo({
	 url: '/pages/index/webview?url=' + url
   })
},

动态配置业务代码:

		skipLink(e) {
			if(this.urlList[e]) {
				uni.navigateTo({
					url: '/pages/index/webview?url=' + this.urlList[e]
				})
			}
		},

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐