lessonList.js 1.3 KB

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