温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

从小程序外部跳转到指定小程序页面_小程序页面获取链接的方法

发布时间:2020-12-21 14:37:13 来源:亿速云 阅读:975 作者:小新 栏目:移动开发

这篇文章将为大家详细讲解有关从小程序外部跳转到指定小程序页面_小程序页面获取链接的方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

小程序里面的链接使用navigator组件

在html中使用a标签, a标签可以链接到网络中的任何地址

而小程序中navigator只能应用于当前小程序内的链接跳转

<navigator url="http://www.baidu.com">跳转A</navigator>

<navigator url='test/t'>跳转B</navigator>

第一个是无效的

第二个能正确跳转, 需要注意的是: url中的页面不能是tabBar(底部菜单)中的页面

但是可以通过open-type属性设置

redirect属性, 打开新页面时, 关闭原页面(在新页面, 不能再返回到原页面)

<navigator redirect url='test/t'>跳转</navigator>

跳转时并传递参数(不用加上引号, 自动会加上双引号, 否则就多余一个引号, 因此直接写: id=111&name=张三):

<navigator  url='test/t?id=111&name=张三'>跳转</navigator>

通过onLoad事件获取url参数, 在加载这个页面时自动将参数放入

<navigator  url='test/t?id=111&name=张三' hover-class='hoverClass'>跳转</navigator>    <!--链接1-->
<navigator  url='test/t?id=123&name=小明'>跳转</navigator>    <!--链接2-->
Page({
  data: {

  },
  onLoad : function(datas) {
    console.log(datas);
  }
})

如果点击链接1, 则datas的值是{id: "111", name: "张三"}, 点击链接2, 则datas的值是{id: "123", name: "小明"}

hover-class是点上去后的样式

wx.navigateTo

此Api也可以完成页面跳转, 与navigator(无redirect属性)相同

<button size='mini' bindtap="navigator">跳转</button>
navigator : function() {
    wx.navigateTo({
      url: 'test/t?id=100&user=xiaoming',
      success : function(e) {
        console.log(e.errMsg);
      }
    })
  }

wx.redirectTo

此Api也也可以完成页面跳转, 与navigator(有redirect属性)相同, 操作与上相同

wx.navigateBack

此Api用于返回, 从当前页面返回到上级页面(根据如下参数)

Page({
  data: {

  },
  back : function() {
    wx.navigateBack({
      delta : 1            // 值为1, 则是返回上一级, 值为2就返回上两级...
    })
  }
})

如果dellta的值为1, 则可以不写dellta属性: wx.navigateBack({})

如果dellta的值超过了其能返回的总级数, 则会返回首页

关于从小程序外部跳转到指定小程序页面_小程序页面获取链接的方法就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI