微信小程序开发之路由切换页面重定向问题

站长资源 2024/12/30 佚名

29 1538 29

铁雪资源网 Design By www.gsvan.com

这段时间开发了一个微信小程序，虽然小程序的导航API 官方文档写得很详细，但是在具体开发过程中还是会遇到很多不明白，或者一时转不过弯的地方。

1、页面切换传参，参数读取　

　　1.1 wx.navigateTo(Object)

　　功能：保留当前页面，跳转到应用内的某个页面，但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到当前页面。

wx.navigateTo({ //当前页面对应的JS文件内控制模板 url: 'test"htmlcode">

wx.reLaunch({  //token失效，界面重定向到登录页,绝对路劲
 url: "/pages/login/login",
});

2、相对路径和绝对路径

　　2.1、绝对路径；

　　以 “/” 开头代表根目录，

　　　　/pages/login/login

　　2.2、相对路径

　　以 “../” 开头，从当前页面一级一级往上级目录倒退

　　　　../../module/customer/main/main

　　或者：

　　以 “./” 开头，直接在当前目录
　　./registered

补充：下面看下微信小程序的路由跳转方法

路由跳转的方法

1.打开新页面

1.wx.navigateTo 或使用组件 <navigator open-type="navigateTo"/>

保留当前页面，跳转到应用内的某个页面，使用 wx.navigateBack 可以返回到原页面。

属性用法：

url：类型是String 跳转非 tabBar 的页面的路径 , 路径后可以带参数。参数与路径之间使用"htmlcode">

wx.navigateTo({ url: 'test"redirectTo"/>

属性用法：

url：类型是String 跳转非 tabBar 的页面的路径 , 路径后可以带参数。参数与路径之间使用"htmlcode">

wx.redirectTo({ url: 'test"navigateBack">

关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages()) 获取当前的页面栈，决定需要返回几层。

属性用法：

url：类型是String 跳转非 tabBar 的页面的路径 , 路径后可以带参数。参数与路径之间使用"htmlcode">

// 此处是A页面 wx.navigateTo({ url: 'B"switchTab "/>

属性用法：

          url：         类型是String     需要跳转的 tabBar 页面的路径（需在 app.json 的 [tabBar]字段定义的页面），路径后不能带参数
          success：     类型Function     接口调用成功的回调函数
          fail：        类型Function     接口调用失败的回调函数
          complete：    类型Function     接口调用结束的回调函数（调用成功、失败都会执行）
例：

{
  "tabBar": {
   "list": [{
    "pagePath": "index",
    "text": "首页"
   },{
   "pagePath": "other",
   "text": "其他"
   }]
   }
  }
 wx.switchTab({
   url: '/index'
 })

5.Tab 切换

1.wx.reLaunch 或使用组件 <navigator open-type="reLaunch"/>

闭所有页面，打开到应用内的某个页面

属性用法：

url：需要跳转的应用内页面路径 , 路径后可以带参数。参数与路径之间使用"htmlcode">

wx.reLaunch({ url: 'test"color: #ff0000">总结

以上所述是小编给大家介绍的微信小程序开发之路由切换页面重定向问题，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！

微信小程序路由切换,微信小程序页面重定向,微信小程序路由跳转

标签：