index.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  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. (0, 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. (0, utils_1.requestAnimationFrame)(function () {
  62. Promise.all([
  63. (0, utils_1.getRect)(_this, '.van-notice-bar__content'),
  64. (0, utils_1.getRect)(_this, '.van-notice-bar__wrap'),
  65. ]).then(function (rects) {
  66. var contentRect = rects[0], wrapRect = rects[1];
  67. var _a = _this.data, speed = _a.speed, scrollable = _a.scrollable, delay = _a.delay;
  68. if (contentRect == null ||
  69. wrapRect == null ||
  70. !contentRect.width ||
  71. !wrapRect.width ||
  72. scrollable === false) {
  73. return;
  74. }
  75. if (scrollable || wrapRect.width < contentRect.width) {
  76. var duration = ((wrapRect.width + contentRect.width) / speed) * 1000;
  77. _this.wrapWidth = wrapRect.width;
  78. _this.contentWidth = contentRect.width;
  79. _this.duration = duration;
  80. _this.animation = wx.createAnimation({
  81. duration: duration,
  82. timingFunction: 'linear',
  83. delay: delay,
  84. });
  85. _this.scroll();
  86. }
  87. });
  88. });
  89. },
  90. scroll: function () {
  91. var _this = this;
  92. this.timer && clearTimeout(this.timer);
  93. this.timer = null;
  94. this.setData({
  95. animationData: this.resetAnimation
  96. .translateX(this.wrapWidth)
  97. .step()
  98. .export(),
  99. });
  100. (0, utils_1.requestAnimationFrame)(function () {
  101. _this.setData({
  102. animationData: _this.animation
  103. .translateX(-_this.contentWidth)
  104. .step()
  105. .export(),
  106. });
  107. });
  108. this.timer = setTimeout(function () {
  109. _this.scroll();
  110. }, this.duration);
  111. },
  112. onClickIcon: function (event) {
  113. if (this.data.mode === 'closeable') {
  114. this.timer && clearTimeout(this.timer);
  115. this.timer = null;
  116. this.setData({ show: false });
  117. this.$emit('close', event.detail);
  118. }
  119. },
  120. onClick: function (event) {
  121. this.$emit('click', event);
  122. },
  123. },
  124. });