uniapp标签跳转
uniapp 标签跳转方法
在 uniapp 中实现页面跳转可以通过多种方式完成，以下为常见的几种方法：
使用 <navigator> 标签
<navigator> 是 uniapp 提供的原生导航组件，类似于 HTML 中的 <a> 标签。通过设置 url 属性指定目标页面路径，open-type 属性定义跳转方式。
<navigator url="/pages/detail/detail" open-type="navigate">跳转到详情页</navigator>open-type 可选值：
navigate：保留当前页面，跳转到新页面（默认值）redirect：关闭当前页面，跳转到新页面switchTab：跳转到 tabBar 页面reLaunch：关闭所有页面，打开新页面
使用 API 跳转
uniapp 提供了一系列页面跳转的 API，可以在 JavaScript 中调用：
// 保留当前页面，跳转到新页面
uni.navigateTo({
url: '/pages/detail/detail'
});
// 关闭当前页面，跳转到新页面
uni.redirectTo({
url: '/pages/detail/detail'
});
// 跳转到 tabBar 页面
uni.switchTab({
url: '/pages/index/index'
});
// 关闭所有页面，打开新页面
uni.reLaunch({
url: '/pages/index/index'
});传递参数
跳转时可以传递参数，在目标页面通过 onLoad 生命周期函数接收：
// 跳转时传递参数
uni.navigateTo({
url: '/pages/detail/detail?id=1&name=test'
});
// 目标页面接收参数
onLoad(options) {
console.log(options.id); // 输出 1
console.log(options.name); // 输出 test
}注意事项
- 跳转路径需要写在 pages.json 中配置的页面路径
- tabBar 页面只能使用
switchTab跳转 - 页面路径前需要加
/，表示从根目录开始 - 传递的参数会显示在 url 中，敏感数据不建议通过 url 传递
以上方法可以根据实际需求选择使用，<navigator> 适合简单的静态跳转，API 方式适合需要逻辑判断的动态跳转。
