微信开发者工具之页面跳转

1.声明式页面导航(跳转):

//跳转到tabBar页面
<navigator url="路径" open-type="switchTab">打开tabBar界面</navigator> 

//跳转到非tabBar页面  此处open-type可以省略
<navigator url="路径" open-type="navigate">打开非tabBar页面</navigator> 

//后退到前一个页面 delta后退页数(默认为1，不需要后退页数多于1可以省略)
<navigator  open-type="navigateBack" delta="1">后退</navigator> 

2.编程式页面导航(跳转):

//abc.wxml
<button bindtap="gotomessage">跳到其他页面</button>

//abc.js
page({
      gotomessage(){
         wx.switchTab({      //wx.switchTab自带API跳转到tabBar页面  
             url:'路径'      //跳转到非tabBar页面:wx.navigateTo代替wx.switchTab即可
         })                 
      }  
})

// 后退页面:
wx.navigateBack({
         delta:1(可省略)
 })  

3导航参数:

  3.1页面传参

<navigator url="路径?name=imbzz&age=20">页面跳转</navigator>
 
//?:分隔路径和参数

//&:分隔不同参数

微信开发者工具左下角调试器可查看页面参数

3.2 onLoad接受页面参数:

page({ 
      data:{
        query:   //默认为传递过来的参数
       }

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options){        //options就是导航传递过来的参数对象
       this.setData({
             query:options   //将传递过来的参数(例:name:imbzz age:20)储存到data中的query
       })
    },




})