index.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. "use strict";
  2. exports.__esModule = true;
  3. exports.default = void 0;
  4. var _utils = require("../utils");
  5. var _relation = require("../mixins/relation");
  6. var _constant = require("../utils/constant");
  7. var _scroll = require("../utils/dom/scroll");
  8. var _createNamespace = (0, _utils.createNamespace)('index-anchor'),
  9. createComponent = _createNamespace[0],
  10. bem = _createNamespace[1];
  11. var _default = createComponent({
  12. mixins: [(0, _relation.ChildrenMixin)('vanIndexBar', {
  13. indexKey: 'childrenIndex'
  14. })],
  15. props: {
  16. index: [Number, String]
  17. },
  18. data: function data() {
  19. return {
  20. top: 0,
  21. left: null,
  22. rect: {
  23. top: 0,
  24. height: 0
  25. },
  26. width: null,
  27. active: false
  28. };
  29. },
  30. computed: {
  31. sticky: function sticky() {
  32. return this.active && this.parent.sticky;
  33. },
  34. anchorStyle: function anchorStyle() {
  35. if (this.sticky) {
  36. return {
  37. zIndex: "" + this.parent.zIndex,
  38. left: this.left ? this.left + "px" : null,
  39. width: this.width ? this.width + "px" : null,
  40. transform: "translate3d(0, " + this.top + "px, 0)",
  41. color: this.parent.highlightColor
  42. };
  43. }
  44. }
  45. },
  46. mounted: function mounted() {
  47. var rect = this.$el.getBoundingClientRect();
  48. this.rect.height = rect.height;
  49. },
  50. methods: {
  51. scrollIntoView: function scrollIntoView() {
  52. this.$el.scrollIntoView();
  53. },
  54. getRect: function getRect(scroller, scrollerRect) {
  55. var el = this.$el;
  56. var elRect = el.getBoundingClientRect();
  57. this.rect.height = elRect.height;
  58. if (scroller === window || scroller === document.body) {
  59. this.rect.top = elRect.top + (0, _scroll.getRootScrollTop)();
  60. } else {
  61. this.rect.top = elRect.top + (0, _scroll.getScrollTop)(scroller) - scrollerRect.top;
  62. }
  63. return this.rect;
  64. }
  65. },
  66. render: function render() {
  67. var _ref;
  68. var h = arguments[0];
  69. var sticky = this.sticky;
  70. return h("div", {
  71. "style": {
  72. height: sticky ? this.rect.height + "px" : null
  73. }
  74. }, [h("div", {
  75. "style": this.anchorStyle,
  76. "class": [bem({
  77. sticky: sticky
  78. }), (_ref = {}, _ref[_constant.BORDER_BOTTOM] = sticky, _ref)]
  79. }, [this.slots('default') || this.index])]);
  80. }
  81. });
  82. exports.default = _default;