小程序中的路由

小程序中的路由

标签的方式

类似于vue中的 vue-router

标签:<navigator url="路径" open-type="指定跳转方式">

例如: <navigator url="{{ item.url }}" open-type="redirect">跳转</navigator>

说明:open-type

指定跳转方式:与JS跳转方式一一对应

值         说明
navigate    对应 wx.navigateTo
redirect    对应 wx.redirectTo 的功能    
switchTab   对应 wx.switchTab 的功能 
reLaunch    对应 wx.reLaunch 的功能  1.1.0
navigateBack    对应 wx.navigateBack 的功能

js的方式

JS:

1.wx.navigateTo(url:'path?参数名=值')

特点:
(1)带历史回退功能,类似于vue中的this.$router.push()
(2)不能导航到tabBar页面

路由跳转如何传参:

例如:

传:
wx.navigateTo({
url: ''/pages/list/list?title=title'',
})

接:在接收的页面通过onLoad生命周期中的options来接收

2.wx.switchTab()

特点:只能打开tabBar页面

3.wx.reLaunch()

特点:

  1.即可以打开tabBar页面,也可以打开非tabBar页面
  2.不能回退,只能点击左个角的home,回到首页

4.wx.redirectTo()

类似于vue中的this.$router.replace('/home');

特点:
  1.只能打开非tabBar页面
  2.不能回退,只能点击左个角的home,回到首页

5.wx.navigateBack()进行历史回退 类似于JS中的history.go(-1)

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。