swan.navigateTo

  • 如果两种方式都能满足您的使用场景,推荐您使用 navigator 组件 实现相应的导航功能,以便更好的被搜索引擎理解。

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

方法参数

Object object

object参数说明

属性名类型必填默认值说明
urlString需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数。参数与路径之间使用?分隔,参数键与参数值用=相连,不同参数用&分隔;如 ‘path?key=value&key2=value2’。
successFunction接口调用成功的回调函数
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

示例

扫码体验

swan.navigateTo - 图1请使用百度APP扫码

代码示例

在开发者工具中预览效果

  1. <view class="wrap">
  2. <button bind:tap="navigateTo" type="primary" hover-stop-propagation="true">跳转新页面</button>
  3. </view>
  1. Page({
  2. data: { },
  3. navigateTo(e) {
  4. swan.navigateTo({
  5. url: '/detail/detail?id=新页面'
  6. });
  7. }
  8. });

参考示例

参考示例 - 根据页面栈来判断页面层级

在开发者工具中预览效果

  1. // 目标页面
  2. Page({
  3. onLoad(options) {
  4. this.setData({
  5. 'id': options.id
  6. });
  7. },
  8. onShow() {
  9. console.log(getCurrentPages()); // [{uri: 'index/index'}]
  10. },
  11. navigateBack(e) {
  12. swan.navigateBack({
  13. delta: 2
  14. });
  15. }
  16. });

Bug & Tip

jssdk 在 web-view 中使用 swan.navigateTo 接口跳转 success、fail、complete 回调函数不显示。