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

来源:互联网 发布:网络文明与安全ppt 编辑:程序博客网 时间:2024/06/05 07:13

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

仿美团分类菜单

代码: 
js就这么一点

//index.js  //获取应用实例  var app = getApp()Page({  data: {    currentTab: 0,    grids: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],    swiperList:[0, 1, 2, 3, 4]  },  onLoad: function () {  },  click: function (e) {    console.log(e.currentTarget.dataset.id)    console.log(e.currentTarget.dataset.index)    wx.showToast({      title: '第' + e.currentTarget.dataset.id + '栏' + '第' + e.currentTarget.dataset.index + '个',      icon: 'success',      duration: 1500    })  },  /**      * 滑动切换tab      */  bindChange: function (e) {    console.log(e.detail.current)    this.setData({ currentTab: e.detail.current });  },})
  • 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
  • 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

demo下载地址 
我的博客,欢迎批评! 
CSDN微信小程序开发专栏,欢迎关注!

0 0
原创粉丝点击