有时候,因为业务需求,在小程序中需要跳转到H5网页或公众号,形成流量的闭环。那么,在小程序中如何实现这样的跳转呢?
实例效果:小程序实现跳转到公众号的前提条件是,web-view组件提供了一个src属性,这个属性就是用于从小程序跳转到指定链接的途径。
注意:在使用web-view时,需要单独在小程序中创建一个页面,并在app.json中的pages中进行注册。例如,如下所示,然后在web-view中的wxml中使用web-view标签,在web-view标签上设置的src属性就是要跳转的目的地。
在触发事件处:绑定事件。
以下是逻辑代码:
上面示例代码中的跳转参数url、nav在另一个页面web-view中的onLoad生命周期函数中的options参数中可以接收得到,重新赋新值即可。
在webview页面中,示例代码如下所示:
webview的逻辑页面
如上代码就可以实现小程序跳转到公众号。
小程序实现跳转到H5网页:小程序跳转到H5网页与跳转公众号类似,只需要将上面的url地址切换成自己想要的链接即可。
注意:跳转到的网页需要在小程序后配置支持业务域名即可完成跳转,否则是跳转失败的。
如下所示,跳转至
https://coder.itclan.cn/:
可能会遇到的问题:
原因:
出于安全性的考虑,web-view做了一些限制。使用web-view一般而言,比较适合那种频繁改动的活动页,或者在小程序中难以实现的业务,从而选择H5来代替。至于使用原生还是H5,具体还得看业务场景。比如:小程序对于画布,频繁的绘制会很消耗性能,有时候,使用H5就很适合,在小程序中嵌入webview就比较适合的。