index.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var component_1 = require('../common/component');
  4. var utils_1 = require('../common/utils');
  5. component_1.VantComponent({
  6. props: {
  7. text: {
  8. type: String,
  9. value: '',
  10. observer: 'init',
  11. },
  12. mode: {
  13. type: String,
  14. value: '',
  15. },
  16. url: {
  17. type: String,
  18. value: '',
  19. },
  20. openType: {
  21. type: String,
  22. value: 'navigate',
  23. },
  24. delay: {
  25. type: Number,
  26. value: 1,
  27. },
  28. speed: {
  29. type: Number,
  30. value: 60,
  31. observer: 'init',
  32. },
  33. scrollable: null,
  34. leftIcon: {
  35. type: String,
  36. value: '',
  37. },
  38. color: String,
  39. backgroundColor: String,
  40. background: String,
  41. wrapable: Boolean,
  42. },
  43. data: {
  44. show: true,
  45. },
  46. created: function () {
  47. this.resetAnimation = wx.createAnimation({
  48. duration: 0,
  49. timingFunction: 'linear',
  50. });
  51. },
  52. destroyed: function () {
  53. this.timer && clearTimeout(this.timer);
  54. },
  55. mounted: function () {
  56. this.init();
  57. },
  58. methods: {
  59. init: function () {
  60. var _this = this;
  61. utils_1.requestAnimationFrame(function () {
  62. Promise.all([
  63. utils_1.getRect(_this, '.van-notice-bar__content'),
  64. utils_1.getRect(_this, '.van-notice-bar__wrap'),
  65. ]).then(function (rects) {
  66. var contentRect = rects[0],
  67. wrapRect = rects[1];
  68. var _a = _this.data,
  69. speed = _a.speed,
  70. scrollable = _a.scrollable,
  71. delay = _a.delay;
  72. if (
  73. contentRect == null ||
  74. wrapRect == null ||
  75. !contentRect.width ||
  76. !wrapRect.width ||
  77. scrollable === false
  78. ) {
  79. return;
  80. }
  81. if (scrollable || wrapRect.width < contentRect.width) {
  82. var duration =
  83. ((wrapRect.width + contentRect.width) / speed) * 1000;
  84. _this.wrapWidth = wrapRect.width;
  85. _this.contentWidth = contentRect.width;
  86. _this.duration = duration;
  87. _this.animation = wx.createAnimation({
  88. duration: duration,
  89. timingFunction: 'linear',
  90. delay: delay,
  91. });
  92. _this.scroll();
  93. }
  94. });
  95. });
  96. },
  97. scroll: function () {
  98. var _this = this;
  99. this.timer && clearTimeout(this.timer);
  100. this.timer = null;
  101. this.setData({
  102. animationData: this.resetAnimation
  103. .translateX(this.wrapWidth)
  104. .step()
  105. .export(),
  106. });
  107. utils_1.requestAnimationFrame(function () {
  108. _this.setData({
  109. animationData: _this.animation
  110. .translateX(-_this.contentWidth)
  111. .step()
  112. .export(),
  113. });
  114. });
  115. this.timer = setTimeout(function () {
  116. _this.scroll();
  117. }, this.duration);
  118. },
  119. onClickIcon: function (event) {
  120. if (this.data.mode === 'closeable') {
  121. this.timer && clearTimeout(this.timer);
  122. this.timer = null;
  123. this.setData({ show: false });
  124. this.$emit('close', event.detail);
  125. }
  126. },
  127. onClick: function (event) {
  128. this.$emit('click', event);
  129. },
  130. },
  131. });