小程序界面交互及路由

152 阅读1分钟

界面交互 API

名称功能说明
wx.showModal显示模态对话框
wx.showToast显示消息提示框
wx.hideToast隐藏消息提示框
wx.showLoading显示 loading 提示框
wx.hideLoading隐藏 loading 提示框

小程序页面跳转

小程序跳转页面主要有两种方式:

  • <navigator> 组件直接跳转。
  • 事件绑定内部通过 WX API跳转。

路由 API

WX API备注官方功能说明
wx.switchTab跳转 tabBar跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面
wx.reLaunch重启整个小程序关闭所有页面,打开到应用内的某个页面
wx.redirectTo替换页面关闭当前页面,跳转到应用内的某个页面
wx.navigateTo跳转普通页保留当前页面,跳转到应用内的某个页面
wx.navigateBack普通页的后退关闭当前页面,返回上一页面或多级页面

<navigator> 组件写法

<navigator open-type="navigate">跳转普通页</navigator>
<navigator open-type="redirect">替换普通页</navigator>
<navigator open-type="switchTab">跳转tabBar页</navigator>
<navigator open-type="reLaunch">重启小程序</navigator>
<navigator open-type="navigateBack">后退返回</navigator>
open-type 的合法值说明
navigate对应 wx.navigateTo 的功能
redirect对应 wx.redirectTo 的功能
switchTab对应 wx.switchTab 的功能
reLaunch对应 wx.reLaunch 的功能
navigateBack对应 wx.navigateBack 的功能