index.js 4.0 KB

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