项目原始demo,不改动
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.
Dieses Repo ist archiviert. Du kannst Dateien sehen und es klonen, kannst aber nicht pushen oder Issues/Pull-Requests öffnen.
 
 
 
 

80 Zeilen
2.0 KiB

  1. // Extensions
  2. import { BaseSlideGroup } from '../VSlideGroup/VSlideGroup'; // Mixins
  3. import Themeable from '../../mixins/themeable';
  4. import SSRBootable from '../../mixins/ssr-bootable'; // Utilities
  5. import mixins from '../../util/mixins';
  6. export default mixins(BaseSlideGroup, SSRBootable, Themeable
  7. /* @vue/component */
  8. ).extend({
  9. name: 'v-tabs-bar',
  10. provide() {
  11. return {
  12. tabsBar: this
  13. };
  14. },
  15. computed: {
  16. classes() {
  17. return { ...BaseSlideGroup.options.computed.classes.call(this),
  18. 'v-tabs-bar': true,
  19. 'v-tabs-bar--is-mobile': this.isMobile,
  20. // TODO: Remove this and move to v-slide-group
  21. 'v-tabs-bar--show-arrows': this.showArrows,
  22. ...this.themeClasses
  23. };
  24. }
  25. },
  26. watch: {
  27. items: 'callSlider',
  28. internalValue: 'callSlider',
  29. $route: 'onRouteChange'
  30. },
  31. methods: {
  32. callSlider() {
  33. if (!this.isBooted) return;
  34. this.$emit('call:slider');
  35. },
  36. genContent() {
  37. const render = BaseSlideGroup.options.methods.genContent.call(this);
  38. render.data = render.data || {};
  39. render.data.staticClass += ' v-tabs-bar__content';
  40. return render;
  41. },
  42. onRouteChange(val, oldVal) {
  43. /* istanbul ignore next */
  44. if (this.mandatory) return;
  45. const items = this.items;
  46. const newPath = val.path;
  47. const oldPath = oldVal.path;
  48. let hasNew = false;
  49. let hasOld = false;
  50. for (const item of items) {
  51. if (item.to === newPath) hasNew = true;else if (item.to === oldPath) hasOld = true;
  52. if (hasNew && hasOld) break;
  53. } // If we have an old item and not a new one
  54. // it's assumed that the user navigated to
  55. // a path that is not present in the items
  56. if (!hasNew && hasOld) this.internalValue = undefined;
  57. }
  58. },
  59. render(h) {
  60. const render = BaseSlideGroup.options.render.call(this, h);
  61. render.data.attrs = {
  62. role: 'tablist'
  63. };
  64. return render;
  65. }
  66. });
  67. //# sourceMappingURL=VTabsBar.js.map