index.js 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import { createNamespace } from '../utils';
  3. import { ChildrenMixin } from '../mixins/relation';
  4. import { routeProps } from '../utils/router';
  5. var _createNamespace = createNamespace('tab'),
  6. createComponent = _createNamespace[0],
  7. bem = _createNamespace[1];
  8. export default createComponent({
  9. mixins: [ChildrenMixin('vanTabs')],
  10. props: _extends({}, routeProps, {
  11. dot: Boolean,
  12. name: [Number, String],
  13. // @deprecated
  14. info: [Number, String],
  15. badge: [Number, String],
  16. title: String,
  17. titleStyle: null,
  18. titleClass: null,
  19. disabled: Boolean
  20. }),
  21. data: function data() {
  22. return {
  23. inited: false
  24. };
  25. },
  26. computed: {
  27. computedName: function computedName() {
  28. var _this$name;
  29. return (_this$name = this.name) != null ? _this$name : this.index;
  30. },
  31. isActive: function isActive() {
  32. var active = this.computedName === this.parent.currentName;
  33. if (active) {
  34. this.inited = true;
  35. }
  36. return active;
  37. }
  38. },
  39. watch: {
  40. title: function title() {
  41. this.parent.setLine();
  42. this.parent.scrollIntoView();
  43. },
  44. inited: function inited(val) {
  45. var _this = this;
  46. if (this.parent.lazyRender && val) {
  47. this.$nextTick(function () {
  48. _this.parent.$emit('rendered', _this.computedName, _this.title);
  49. });
  50. }
  51. }
  52. },
  53. render: function render(h) {
  54. var slots = this.slots,
  55. parent = this.parent,
  56. isActive = this.isActive;
  57. var slotContent = slots();
  58. if (process.env.NODE_ENV === 'development' && this.info) {
  59. console.warn('[Vant] Tab: "info" prop is deprecated, use "badge" prop instead.');
  60. }
  61. if (!slotContent && !parent.animated) {
  62. return;
  63. }
  64. var show = parent.scrollspy || isActive;
  65. var shouldRender = this.inited || parent.scrollspy || !parent.lazyRender;
  66. var Content = shouldRender ? slotContent : h();
  67. if (parent.animated) {
  68. return h("div", {
  69. "attrs": {
  70. "role": "tabpanel",
  71. "aria-hidden": !isActive
  72. },
  73. "class": bem('pane-wrapper', {
  74. inactive: !isActive
  75. })
  76. }, [h("div", {
  77. "class": bem('pane')
  78. }, [Content])]);
  79. }
  80. return h("div", {
  81. "directives": [{
  82. name: "show",
  83. value: show
  84. }],
  85. "attrs": {
  86. "role": "tabpanel"
  87. },
  88. "class": bem('pane')
  89. }, [Content]);
  90. }
  91. });