微信小程序事件点击跳转页面的五种方法

第一种:标签

这是最常见的一种跳转方式,相当于html里的a标签

java 复制代码
<navigator url="/pages/main/main"></navigator>

第二种:wx.navigateTo({})方法

1.前端wxml

java 复制代码
   <button  bindtap="getCeshi" type="primary"> 测试按钮 </button>

2.js应用

java 复制代码
// 测试按钮点击事件处理函数
Page({
		data: {
		  },
	  getCeshi() {
	    wx.navigateTo({
	      url: '/pages/main/main',
	    })
	  }
  })

第三种:wx.redirectTo({})
功能描述: 关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

类似于页面跳转时 重定向页面,类似于html中的 window.open('...');跳转后左上角出现返回小箭头,点击后可返回原本页面.

java 复制代码
Page({
		data: {
		  },
	  getCeshi() {
	    wx.redirectTo({
		  url: 'test?id=1'
		})
	  }
  })

第四种:wx.switchTab({})
功能描述 跳转到 tabBar ()页面,并关闭其他所有非 tabBar 页面,该方法只能跳转tabbar页面

TabBar,中文叫标签栏、底部tab栏、底部导航等等。TabBar 中的各个页面是并列关系,并且只能选中一个。选中时,标签会高亮。,且左上角不会出现返回箭头

![在这里插入图片描述](https://img-blog.csdnimg.cn/0695e489f142457884b7a8ac51a39231.png

java 复制代码
Page({
		data: {
		  },
	  getCeshi() {
	    wx.switchTab({
		  url: '/index'
		})
	  }
  })

第五种:wx.reLaunch({})

功能描述 关闭所有页面,打开到应用内的某个页面.且左上角不会出现返回箭头。

java 复制代码
Page({
		data: {
		  },
	  getCeshi() {
	   wx.reLaunch({
		  url: 'test?id=1'
		})
	  }
  })
相关推荐
2501_915918413 小时前
uni-app 项目 iOS 上架踩坑经验总结 从证书到审核的避坑指南
android·ios·小程序·https·uni-app·iphone·webview
游戏开发爱好者83 小时前
iOS 上架 uni-app 流程全解析,从打包到发布的完整实践
android·ios·小程序·https·uni-app·iphone·webview
说私域4 小时前
“互联网 +”时代商业生态变革:以开源 AI 智能名片链动 2+1 模式 S2B2C 商城小程序为例
人工智能·小程序·开源
低代码布道师9 小时前
少儿舞蹈小程序(7)打造您的“活”名片:动态展示机构实力
低代码·小程序
程序员陆通13 小时前
用 Cursor AI 快速开发你的第一个编程小程序
人工智能·小程序
鹧鸪云光伏与储能软件开发13 小时前
投资储能项目能赚多少钱?小程序帮你测算
运维·数据库·小程序·光伏·光伏设计软件·光伏设计
微三云-轩13 小时前
小程序:12亿用户的入口,企业数字化的先锋军
大数据·小程序·开源软件
低代码布道师14 小时前
少儿舞蹈小程序(8)校区信息后台搭建
低代码·小程序
2501_9160088914 小时前
iOS 抓包工具有哪些?全面盘点主流工具与功能对比分析
android·ios·小程序·https·uni-app·iphone·webview
2501_9159214314 小时前
iOS混淆工具实战 视频流媒体类 App 的版权与播放安全保护
android·ios·小程序·https·uni-app·iphone·webview