lessonList.js 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. // compontents/lesson_list/lessonList.js
  2. Component({
  3. /**
  4. * 组件的属性列表
  5. * 和curriculum一样
  6. */
  7. properties: {
  8. lessonData: {
  9. type: Array,
  10. value: []
  11. },
  12. height: {
  13. type: String,
  14. value: ''
  15. }
  16. },
  17. /**
  18. * 组件的初始数据
  19. */
  20. data: {
  21. flag: false,
  22. animationData: {},
  23. downUp: '展开',
  24. src: '../../pages/image/toDown.png',
  25. },
  26. /**
  27. * 组件的方法列表
  28. */
  29. methods: {
  30. onTap (e) {
  31. let flage = e.target.dataset.flag;
  32. const height = this.properties.lessonData.length * 72;
  33. if(flage){
  34. this.util(flage, `${this.data.height}rpx`);
  35. this.setData({
  36. 'flag': false,
  37. 'downUp': '展开',
  38. 'src':'../../pages/image/toDown.png'
  39. })
  40. } else {
  41. this.util(flage, height + 'rpx');
  42. this.setData({
  43. 'flag': true,
  44. 'downUp': '收起',
  45. 'src': '../../pages/image/toUp.png'
  46. })
  47. }
  48. },
  49. /* 创建动画并执行 */
  50. util (flag, height) {
  51. // 创建动画实例
  52. var animation = wx.createAnimation({
  53. duration: 200, //动画时长
  54. timingFunction: "linear", //线性
  55. delay: 0 //0则不延迟
  56. });
  57. this.animation = animation;
  58. animation.height(height).step();
  59. this.setData({
  60. animationData: animation.export()
  61. })
  62. }
  63. }
  64. })