- 小程序
前置条件：需在 app.json 中配置 tabBar 属性，且页面属于 TabBar 页面列表
1 2 3 4 5 6 7 8 9 | // app.json{ "tabBar": { "list": [ { "pagePath": "pages/home/index", "text": "首页" }, { "pagePath": "pages/user/index", "text": "我的" } ] }} |
在对应页面的 .js 文件中定义 onTabItemTap 方法：
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | // pages/home/index.jsPage({ // 监听 TabBar 点击事件 onTabItemTap(item) { console.log('当前点击的 Tab 信息:', item) /* 输出结构： { index: 0, // Tab 索引（从0开始） pagePath: "pages/home/index", text: "首页" }*/ // 示例：点击时刷新数据 if (item.index === 0) { this.loadHomeData() } }, loadHomeData() { wx.request({ url: 'https://api.example.com/data', success: (res) => { this.setData({ list: res.data }) } }) }}) |
多 Tab 协同监听
全局覆盖原则：每个 Tab 页面需单独实现 onTabItemTap 方法
差异化处理：通过 item.index 判断具体点击的 Tab
1 2 3 4 5 6 | // pages/user/index.jsonTabItemTap(item) { if (item.index === 1) { this.checkLoginStatus() // 检查用户登录状态 }} |
