微信小程序开发教程-页面跳转-声明式导航 作者：马育民 • 2026-06-21 15:50 • 阅读：10012 # 介绍 wxml中使用 `<navigator>` 标签，无需写JS，适合纯点击跳转 ### 基础语法 ```html <navigator url="跳转地址" open-type="跳转类型">点击跳转</navigator> ``` ### open-type 对应5种跳转模式 ```html <!-- 1. 保留当前页，跳转到新页面（默认） --> <navigator url="/pages/detail/detail">去详情页</navigator> <!-- 2. 关闭当前页，跳转新页面 --> <navigator url="/pages/index/index" open-type="redirect">重定向到首页</navigator> <!-- 3. 返回上一页 --> <navigator open-type="navigateBack" delta="1">返回上一页</navigator> <!-- 4. 切换Tab页面 --> <navigator url="/pages/mine/mine" open-type="switchTab">我的页面</navigator> <!-- 5. 关闭所有页面，跳转指定页面 --> <navigator url="/pages/index/index" open-type="reLaunch">重启到首页</navigator> ``` ### 声明式导航传参 通过url拼接参数传递，和浏览器地址栏传参一致 ```html <navigator url="/pages/detail/detail?id=1001&name=小程序跳转">带参数跳转详情</navigator> ``` ### 禁用跳转（按钮防重复点击） ```html <navigator url="/pages/detail/detail" hover-class="none" disabled="{{isDisable}}">禁止重复跳转</navigator> ``` 原文出处：http://malaoshi.top/show_1GW3XNdt5VPA.html