lessonList.js 1.4 KB

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