微信小程序如何跳转到tabbar页面-陆大湿

 

1、跳转问题

记得前几天在改去水印小程序的前端代码发现一个很坑的地方,跳转的页面不一样,用的方式也不一样的,我还排查了很久,最后才发现问题所在,今天记起来就给大家分享一下,避免大家入坑。

问题:如何跳转到tabbar的页面?

解答:首先也回答下什么是tabbar页面。其实tabbar页面很容易区分,在app.json文件中设置tabBar属性,其实就是底部导航的菜单就叫tabBar,而pagePath路径就是tabbar页面,其他页面就是非tabbar的页面。如下:

微信小程序如何跳转到tabbar页面-陆大湿

介绍完tabbar进入正题:跳转tabbar页面,直接在wxml文件中创建一个goNext点击事件,在js中定义一个函数即可。

wxml中:

微信小程序如何跳转到tabbar页面-陆大湿

js中:

微信小程序如何跳转到tabbar页面-陆大湿

这时候我一直点击都没反应,我排查了很久也没发现原因,因为不会报错,后来我才发现

../wechatMas2/pages/index/index属于tabbar页面,而跳转到tabbar页面需要使用switchTab,后来我修改js码:
微信小程序如何跳转到tabbar页面-陆大湿

最后跳转成功了。

 

2、关于跳转

总结一句话就是:switchTab只能跳转到带有tab的页面,不能跳转到不带tab的页面,跳转不带tab的页面还是用redirectTo或者navigateTo ,故如果post页面没有加入tab选项卡,依然使用redirectTo或者navigateTo。

在微信官方文档中也有详细介绍,不懂得可以去看看。

地址直达:

  •  
https://developers.weixin.qq.com/miniprogram/dev/api/route/wx.switchTab.html

微信小程序如何跳转到tabbar页面-陆大湿

 

3、特别说明

微信客服:ludashi2021

最近如果发现小程序下载不了源码,请点击tabbar中的资源下载,如下图:

微信小程序如何跳转到tabbar页面-陆大湿

扫码关注公众号:

微信小程序如何跳转到tabbar页面-陆大湿

 

本篇文章来源于微信公众号: 陆大湿

上一篇:微信小程序使用wx.redirectTo跳转页面时出现小房子图标解决方法


下一篇:微信小程序tabBar无法显示的问题