index.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. "use strict";
  2. exports.__esModule = true;
  3. exports.default = void 0;
  4. var _utils = require("../utils");
  5. var _constant = require("../utils/constant");
  6. var _interceptor = require("../utils/interceptor");
  7. var _relation = require("../mixins/relation");
  8. var _createNamespace = (0, _utils.createNamespace)('tabbar'),
  9. createComponent = _createNamespace[0],
  10. bem = _createNamespace[1];
  11. var _default = createComponent({
  12. mixins: [(0, _relation.ParentMixin)('vanTabbar')],
  13. props: {
  14. route: Boolean,
  15. zIndex: [Number, String],
  16. placeholder: Boolean,
  17. activeColor: String,
  18. beforeChange: Function,
  19. inactiveColor: String,
  20. value: {
  21. type: [Number, String],
  22. default: 0
  23. },
  24. border: {
  25. type: Boolean,
  26. default: true
  27. },
  28. fixed: {
  29. type: Boolean,
  30. default: true
  31. },
  32. safeAreaInsetBottom: {
  33. type: Boolean,
  34. default: null
  35. }
  36. },
  37. data: function data() {
  38. return {
  39. height: null
  40. };
  41. },
  42. computed: {
  43. fit: function fit() {
  44. if (this.safeAreaInsetBottom !== null) {
  45. return this.safeAreaInsetBottom;
  46. } // enable safe-area-inset-bottom by default when fixed
  47. return this.fixed;
  48. }
  49. },
  50. watch: {
  51. value: 'setActiveItem',
  52. children: 'setActiveItem'
  53. },
  54. mounted: function mounted() {
  55. var _this = this;
  56. if (this.placeholder && this.fixed) {
  57. var setHeight = function setHeight() {
  58. _this.height = _this.$refs.tabbar.getBoundingClientRect().height;
  59. };
  60. setHeight(); // https://github.com/vant-ui/vant/issues/10131
  61. setTimeout(setHeight, 100);
  62. }
  63. },
  64. methods: {
  65. setActiveItem: function setActiveItem() {
  66. var _this2 = this;
  67. this.children.forEach(function (item, index) {
  68. item.nameMatched = item.name === _this2.value || index === _this2.value;
  69. });
  70. },
  71. triggerChange: function triggerChange(active, afterChange) {
  72. var _this3 = this;
  73. (0, _interceptor.callInterceptor)({
  74. interceptor: this.beforeChange,
  75. args: [active],
  76. done: function done() {
  77. _this3.$emit('input', active);
  78. _this3.$emit('change', active);
  79. afterChange();
  80. }
  81. });
  82. },
  83. genTabbar: function genTabbar() {
  84. var _ref;
  85. var h = this.$createElement;
  86. return h("div", {
  87. "ref": "tabbar",
  88. "style": {
  89. zIndex: this.zIndex
  90. },
  91. "class": [(_ref = {}, _ref[_constant.BORDER_TOP_BOTTOM] = this.border, _ref), bem({
  92. unfit: !this.fit,
  93. fixed: this.fixed
  94. })]
  95. }, [this.slots()]);
  96. }
  97. },
  98. render: function render() {
  99. var h = arguments[0];
  100. if (this.placeholder && this.fixed) {
  101. return h("div", {
  102. "class": bem('placeholder'),
  103. "style": {
  104. height: this.height + "px"
  105. }
  106. }, [this.genTabbar()]);
  107. }
  108. return this.genTabbar();
  109. }
  110. });
  111. exports.default = _default;