taro之跳转总结

1.应用内跳转

navigateTo

 

保留当前页面,跳转到应用内的某个页面

采用navigate进行跳转后,左上方会有个小箭头,点击小箭头可以返回跳转前的界面

redirectTo

关闭当前页面跳转到应用内的某个页面

因为采用redirect之后会关闭之前的页面,所以在跳转之后左上角是没有返回箭头的

switchTab 

wx.navigateTo 和 wx.redirectTo 不允许跳转到 tabbar 页面,只能用 wx.switchTab 跳转到 tabbar 页面

reLaunch 

reLaunch的解释为关闭所有网页,跳转到应用内的某个网页

路径上带上内容,比如?id=‘ + id,那么进入目标的页面可以用this.$router.params去取值就可以了

2.小程序与小程序间的跳转 

Taro.navigateToMiniProgram({
        appId: 'wx17b7833097d',
        path: '',
        extraData: {
          foo: 'bar'
        },
        envVersion: 'release',
        success: function(res) {
          // 打开成功
        }
      })

(1)appid:

小程序的appid可以在微信开发者工具右上角的详情中获取

(2)path:

需要跳转到的另外一个小程序中的网页地址
如果地址为空默认打开跳转的小程序的首页,在path中?后面可以接想要传递给目标小程序的参数,这个传递的参数会被保存在query数组中,在目标程序中可以通过app.onshow或者app.onlaunch获取、onload的回调函数也可以获取

//在app.js中写
onShow(e) {
    console.log('onshow_data',e.query)
}
onLaunch(e) {
    console.log('onLaunch_data',e.query)
}

 

(3)extraData: 

存放需要传递给目标小程序的参数,传递的参数被放入extraData数组中,和query一样可以在app.onshow与app.onlaunch中获取

//在app.js中写
onShow(e) {
    console.log('onshow_data',e.extraData)
}
onLaunch(e) {
    console.log('onLaunch_data',e.extraData)
}

 (4)envVersion:

目标小程序的的版本

(5)success:

接口成功调用的回调函数 

(6)fail:

接口调用失败的回调函数

(7)complete:

接口调用结束的回调函数(无论是否调用成功都会触发)

 3.navigator标签跳转

<navigator target="miniProgram" open-type='navigate' app-id='wx042a09f8c1892cb1' path='pages/index/index'>
跳转
</navigator>
<navigator target="miniProgram" open-type="navigate" 
app-id="目标小程序的appid" path="跳转的目标页面地址" extra-data="需要传递的参数" version="目标小程序版本">
打开绑定的小程序</navigator>
  • (1)target用来设定跳转对象self为当前小程序,miniProgram为其他小程序
  • (2)open-type为跳转的方式具体的可以看官方的文档
  • (3)app-id、path与之前的一样
  • (4)extra-data为传递给目标小程序的参数,例如通过extra-data="{{a}}",就可以将参数a传递给目标小程序,a在页面的data中进行定义
  • (5)version代表目标小程序的版本与之前的envVersion是一个东西

 

  • 5
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值