您当前的位置: 首页 > 解决方案

小程序开发:新页面打开链接

  • 作者: admin
  • 发布于 2019-01-22 10:07:55
  • 来源:  
  • 栏目:解决方案

导语: 导语 开发的小程序中有个用户中心,需求是用户可以点击按钮从而跳转到新链接。实际上在做这个需求的时候,并没有很好的方

 

导语

开发的小程序中有个用户中心,需求是用户可以点击按钮从而跳转到新链接。实际上在做这个需求的时候,并没有很好的方法,以往的一些经验,也不适用于小程序,查了一些资料,也没有头绪。最终的实现方法就是使用 navigator 组件,如果哪位有更好的方法,或者我的实现方法有缺陷,请在下方指出。

外链展示页面

首先建立一个目录,这个目录用来展示外链中的内容。因为是外链,所以要用到 web-view(注意这个组件有一些特性,从下方链接中查看)。

看一下目录结构,其中 navigator 就是展示外链的页面

04.jpg

在 navigator.wxml 中,只需要一行代码即可

<web-view src="{{url}}"></web-view>

在 navigator.js 中,修改 url 中的值

onLoad: function (options) {
    if (options.url) {
      this.setData({
        // 设置当前链接
        url: options.url
      })
    } 
  },

用户中心

在用户中心,只需要将链接跳转到 /navigator/navigator 中,并且带上参数即可,看下实例

<!-- {{url}}中是外链地址 --> <navigator url="/navigator/navigator?url={{url}}"></navigator>

上面的方法可以实现,当然实际项目要复杂些的,根据实际需求进行修改。

参考资料: 小程序 、 navigator 、 web-view 。



温馨提示:这篇文章没有解决您的问题?欢迎添加微信:18948083295,有微信小程序专业人员,保证有问必答。转载本站文章请注明转自http://www.okeydown.com/(微信小程序网)。

  • 微信扫描二维码关注官方微信
  • ▲长按图片识别二维码
关注我们

微信小程序官方微信

栏目最新
栏目推荐
返回顶部