小程序 页面跳转方法总结以及优缺点

一、 .wxml跳转

<navigator url="/pages/rebortcontrol/index" class='item'>
//可以添加open-type=""，属性，设置不同跳转方式，常用属性有redirect，switchTab....。
           

二、.js中跳转

//wxml添加bindtap点击监听方法 clickTap
<button class='bt' hidden='{{visible}}' bindtap='clickTap'>立即体验</button>
           

在.js中实现

clickTap：function（）{}

• navigateTo

//navigateTo跳转，只是打开新界面。
  
  clickTap: function (){
       console.log("sss")
             wx.navigateTo({
                    url: '../index/index'
              })
  },
           

注意：该方法不能跳转到tabBar中的导航页界面。

• redirectTo 与reLaunch

// 这俩个方法跳转到指定界面，都会造成界面闪烁的问题，体验不是太好，所以放在一起说；
//另外redirectTo是指关闭当前页跳转新界面，而reLaunch是跳转新界面，关闭之前所有的界面，
//所以一般用在跳转到首界面。

 clickTap: function (){
       console.log("sss")
             wx.reLaunch({
                    url: '../index/index'
              })
  },
           

• switchTab

// 跳转到tabBar页面，并关闭其他所有tabBar页面，并且不会闪烁
 clickTap: function (){
       console.log("sss")
             wx.switchTab({
                    url: '../index/index'
              })
  },
           

• navigateBack

clickTap: function (){
       console.log("sss")
             wx.navigateBack({
                  //  返回到已经打开过并且没被销毁的某个界面，经常用来上一级
              })
  },