微信小程序-LBK:tab分页,简易列表,scroll上下左右滑

[复制链接]
hyt_xcx手机认证 实名认证 视频认证 发表于 2017-1-19 19:41:05 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
实现了一些基本功能,入门者可以学习;
1.png

2.png

3.png

4.png


  1. var order = ['red', 'yellow', 'blue', 'green', 'red']
  2. Page({
  3.   data: {
  4.     toView: 'red',
  5.     scrollTop: 100
  6.   },
  7.   showAction: function () {
  8.     wx.showActionSheet({
  9.       itemList: ['A', 'B', 'C'],
  10.       success: function (res) {
  11.         console.log(res.tapIndex)
  12.       },
  13.       fail: function (res) {
  14.         console.log(res.errMsg)
  15.       }
  16.     })
  17.   },
  18.   showToast: function () {

  19.     wx.showToast({
  20.       title: '加载中',
  21.       icon: 'loading',
  22.       duration: 10000
  23.     })

  24.     setTimeout(function () {
  25.       wx.hideToast()
  26.     }, 2000)



  27.   },
  28.   showDialog: function () {
  29.     wx.showModal({
  30.       title: '提示',
  31.       content: '这是一个模态弹窗',
  32.       success: function (res) {
  33.         if (res.confirm) {
  34.           console.log('用户点击确定')
  35.         } else {
  36.           console.log('用户点击了取消')
  37.         }
  38.       }
  39.     })
  40.   },
  41.   upper: function (e) {
  42.     console.log(e)
  43.   },
  44.   lower: function (e) {
  45.     console.log(e)
  46.   },
  47.   scroll: function (e) {
  48.     console.log(e)
  49.   },
  50.   tap: function (e) {
  51.     for (var i = 0; i < order.length; ++i) {
  52.       if (order[i] === this.data.toView) {
  53.         this.setData({
  54.           toView: order[i + 1]
  55.         })
  56.         break
  57.       }
  58.     }
  59.   },
  60.   tapMove: function (e) {
  61.     this.setData({
  62.       scrollTop: this.data.scrollTop + 10
  63.     })
  64.   },
  65.   onPullDownRefresh: function () {
  66.     console.log("下拉刷新");
  67.   },
  68.   onReachBottom: function () {
  69.     console.log("上拉加载");
  70.   }
  71. })
复制代码
  1. var order = ['red', 'yellow', 'blue', 'green', 'red']
  2. Page({
  3.   data: {
  4.     toView: 'red',
  5.     scrollTop: 100
  6.   },
  7.   upper: function (e) {
  8.     console.log(e)
  9.   },
  10.   lower: function (e) {
  11.     console.log(e)
  12.   },
  13.   scroll: function (e) {
  14.     console.log(e)
  15.   },
  16.   tap: function (e) {
  17.     for (var i = 0; i < order.length; ++i) {
  18.       if (order[i] === this.data.toView) {
  19.         this.setData({
  20.           toView: order[i + 1]
  21.         })
  22.         break
  23.       }
  24.     }
  25.   },
  26.   tapMove: function (e) {
  27.     this.setData({
  28.       scrollTop: this.data.scrollTop + 10
  29.     })
  30.   },
  31.   photo: function () {
  32.     wx.chooseImage({
  33.       count: 9, // 默认9
  34.       sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
  35.       sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
  36.       success: function (res) {
  37.         // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
  38.         var tempFilePaths = res.tempFilePaths
  39.         console.log(tempFilePaths);
  40.       }
  41.     })
  42.   },
  43.   showphoto: function () {
  44.     wx.previewImage({
  45.       current: 'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg', // 当前显示图片的http链接
  46.       urls: ["http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg","http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg","http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg"] // 需要预览的图片http链接列表
  47.     })
  48.   }
  49. })
复制代码


项目地址:
游客,如果您要查看本帖隐藏内容请回复

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ- Archiver-手机版-小黑屋- 浩阳天社区  

Powered by Discuz! X3.2© 2001-2013 Comsenz Inc.  蜀ICP备16032957号-1