小程序onTabItemTap在安卓下和ios不一致的解决方法
小程序项目,根据客户需求,需要在首页的时候,用户再次点击首页按钮,页面回到顶部,但是在其他页面的时候,切换回首页,应该显示用户上次流览的地方。我的导航栏是用tabBar配置的;首先想到的是小程序的onTabltemTap事件(小程序的解释:当前是 tab 页时,点击 tab 时触发);代码如下所示:
1 2 3 4 5 6 7 8 9
| /* 当在本页的时候点击本页按钮 */ onTabItemTap: function (item) { wx.pageScrollTo({ scrollTop: 0, duration: 300 },
|
这样写在开发者工具中测试是没问题的,可以达到我们要的效果,然后是iPhone手机测试也是没有问题的。但是,在安卓手机下,从其他页面切换回首页的时候,页面也会回到顶部,这样显然是不合理的。
又搜了小程序的其他方法,目测就这个能实现。现在的问题就是安卓手机上的问题,于是就对安卓手机进行兼容就好了。下面是解决方法:
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 28 29 30 31 32
| data: { system: "", isIndex: 1 // 判断是否是在index页,1为在,0为不在 }, /* 页面关闭 */ onHide: function () { this.data.isIndex = 0; }, /* 当在本页的时候点击本页按钮 */ onTabItemTap: function (item) { console.log(item); console.log(this.data.system) if (this.data.system.indexOf("ios") > -1){ wx.pageScrollTo({ scrollTop: 0, duration: 300 }) } else { if(this.data.isIndex == 1) { wx.pageScrollTo({ scrollTop: 0, duration: 300 }) }else { this.data.isIndex = 1; } } },
|
实现逻辑就是首先判断是否是安卓机,如果是安卓则进行下面的判断,用一个变量判断是否是在本页面点击的,如果是在本页点击,则执行页面回顶部;如果是在其他页面切换过来的,则不执行,但是让判断是否本页的变量变为一,表示是在本页了;当页面切换出去的时候,让变量变为0,表示不在本页了。