微信小程序导航navigator,导航传参

内联式导航

<navigator url="/pages/form/form">进入表单元素页面</navigator>

注意不能跳转到tabBar页面,且会保留当前页面

若要跳转到tabBar页面,设置跳转方式:open-type:switchTab

<navigator open-type="switchTab" url="/pages/index/index">跳到首页</navigator>

内联式导航传参

<navigator url="/pages/index/index?id="{{isShow}}">进入首页</navigator>

编程式导航

<button bindtap="clik">点我进入首页</button>

data:{
   dataId:1,
   name:'abc'
}
   
clik(){
   wx.navigateTo({
      url:"/pages/index/index?id="+this.data.dataId+"&name="+this.data.name//导航传参
   })
}

注意:小程序页面栈最多只有10层,除了tabBar的页面,其他页面间互相跳转最多只能跳10层

接收参数

在跳转的页面的onLoad函数中的options接收

  onLoad: function(options) {
    console.log(options)
  },

若需要返回,可使用wx.navigateBack

// 此处是A页面
wx.navigateTo({
  url: 'B?id=1'
})

// 此处是B页面
wx.navigateTo({
  url: 'C?id=1'
})

// 在C页面内 navigateBack，将返回A页面
wx.navigateBack({
  delta: 2
})

wx.redirectTo

关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

wx.redirectTo({
  url: '/pages/index/index?id=1'
})