博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信小程序开发--路由切换,页面重定向
阅读量:5085 次
发布时间:2019-06-13

本文共 1621 字,大约阅读时间需要 5 分钟。

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

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

  1.1  wx.navigateTo(object)

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

wx.navigateTo({     //当前页面对应的JS文件内 控制模板  url: 'test?id=1'     //需要切换到的页面路劲,此处为相对路劲,id为传递的参数})//test.js         //test页面对应的JS文件,名字必须相同Page({      onLoad: function(option){     //通过路由传递过来的参数,只能在onLoad方法内收到,option就是路由参数的一个组合对象    console.log(option.id)  }})

  1.2   wx.navigateBack(object)

  功能:关闭当前页面,与 wx.navigateTo({ })功能相对。返回上一页面或多级页面。可通过  获取当前的页面栈,决定需要返回几层。

 

  1.3  wx.redirectTo(object)    

  功能:关闭当前页面,跳转到应用内的某个页面【这里的跳转最好写绝对路劲,当然如果只是从当前页面往一个具体页面跳转(次数不多),相对路劲也可以。但如果是 wx.request(object) 请求返回状态进行页面跳转,那就最好写绝对路劲,但是不允许跳转到 tabbar 页面。

  

  1.4  wx.switchTab(object)

  功能:跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面,与wx.redirectTo(object)方法功能互补。

 

  1.5  wx.reLaunch(object)

  功能:关闭所有页面,打开到应用内的某个页面【这种情况最好用绝对定位,因为是关闭所有页面,已经不需要知道当前所处页面了,直接重定向到某个具体页面。这种一般都是重定向到登录或者初始页面

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

2、相对路径和绝对路径

  2.1、绝对路径

  以 “/” 开头代表根目录,表示从根目录下来的直接路劲,不以当前页面所处位置改变而改变。适用于重定向到具体页面,因此比较适用于 wx.redirectTo(object) 和 wx.reLaunch(object)

    /pages/login/login

  2.2、相对路径

   “../” 开头,从当前页面一级一级往上级目录倒退,然后再从共同目录一级级向下找到具体页面。这种一般 wx.navigateTo(object) 用的多,因为它要保存当前页面,便于返回

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

  或者:

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

  ./registered 或者 registered
  app.json文件内配置的路径都是以pages目录为根目录的相对路劲。

  因此在进行页面跳转的时候,都需要写成相对路劲的格式,不然就会报错:路劲页面不存在。如果不想这么一级级往上倒退,尤其是 wx.redirectTo(object) 和 wx.reLaunch(object),那就直接写成绝对路劲格式。在 "pages" 前面加上 "/",如上面 wx.reLaunch(object) 示例。

转载于:https://www.cnblogs.com/donghuang/p/9663656.html

你可能感兴趣的文章
Python-Web框架的本质
查看>>
QML学习笔记之一
查看>>
Window 的引导过程
查看>>
App右上角数字
查看>>
从.NET中委托写法的演变谈开去(上):委托与匿名方法
查看>>
小算法
查看>>
201521123024 《java程序设计》 第12周学习总结
查看>>
新作《ASP.NET MVC 5框架揭秘》正式出版
查看>>
IdentityServer4-用EF配置Client(一)
查看>>
WPF中实现多选ComboBox控件
查看>>
读构建之法第四章第十七章有感
查看>>
Windows Phone开发(4):框架和页 转:http://blog.csdn.net/tcjiaan/article/details/7263146
查看>>
Unity3D研究院之打开Activity与调用JAVA代码传递参数(十八)【转】
查看>>
python asyncio 异步实现mongodb数据转xls文件
查看>>
TestNG入门
查看>>
【ul开发攻略】HTML5/CSS3菜单代码 阴影+发光+圆角
查看>>
IOS-图片操作集合
查看>>
IO—》Properties类&序列化流与反序列化流
查看>>
测试计划
查看>>
Mysql与Oracle 的对比
查看>>