欢迎光临,了解微信小程序开发,就上易用通!

微信小程序 仿美团分类菜单 swiper分类菜单

发布:2017-12-12 17:53浏览: 来源:网络 作者:tianshu

分类菜单微信小程序开发之选项卡(窗口顶部TabBar)页面切换很类似

 
 
 

有同学要仿美团分类菜单.写了一个. 
跟 微信小程序开发之选项卡(窗口顶部TabBar)页面切换很类似

微信小程序 仿美团分类菜单 swiper分类菜单(图1)

仿美团分类菜单

代码: 
js就这么一点

 

		
  1. //index.js
  2. //获取应用实例
  3. var app = getApp()
  4. Page({
  5. data: {
  6. currentTab: 0,
  7. grids: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
  8. swiperList:[0, 1, 2, 3, 4]
  9. },
  10. onLoad: function () {
  11. },
  12. click: function (e) {
  13. console.log(e.currentTarget.dataset.id)
  14. console.log(e.currentTarget.dataset.index)
  15. wx.showToast({
  16. title: '第' + e.currentTarget.dataset.id + '栏' + '第' + e.currentTarget.dataset.index + '个',
  17. icon: 'success',
  18. duration: 1500
  19. })
  20. },
  21. /**
  22. * 滑动切换tab
  23. */
  24. bindChange: function (e) {
  25. console.log(e.detail.current)
  26. this.setData({ currentTab: e.detail.current });
  27. },
  28. })





免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。