vdesign-ui 0.2.8 → 0.2.9

package/dist/vdesign-ui.umd.js

@@ -432,14 +432,10 @@ module.exports = typeof documentAll == 'undefined' && documentAll !== undefined
 
 /***/ }),
 
-/***/ "1925":
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_11_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_11_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_11_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_11_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_430e7741_prod_lang_less__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("9afc");
-/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_11_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_11_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_11_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_11_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_430e7741_prod_lang_less__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_11_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_11_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_11_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_11_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_430e7741_prod_lang_less__WEBPACK_IMPORTED_MODULE_0__);
-/* unused harmony reexport * */
+/***/ "177f":
+/***/ (function(module, exports, __webpack_require__) {
 
+// extracted by mini-css-extract-plugin
 
 /***/ }),
 
@@ -530,6 +526,17 @@ module.exports = function (it) {
 /* unused harmony reexport * */
 
 
+/***/ }),
+
+/***/ "230a":
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_11_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_11_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_11_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_11_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_6cfdbc71_prod_lang_less__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("177f");
+/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_11_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_11_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_11_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_11_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_6cfdbc71_prod_lang_less__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_11_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_11_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_11_oneOf_1_2_node_modules_less_loader_dist_cjs_js_ref_11_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_1_0_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_id_6cfdbc71_prod_lang_less__WEBPACK_IMPORTED_MODULE_0__);
+/* unused harmony reexport * */
+
+
 /***/ }),
 
 /***/ "2310":
@@ -10354,13 +10361,6 @@ module.exports = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUgAAADsCAMAAAAh
 
 /***/ }),
 
-/***/ "9afc":
-/***/ (function(module, exports, __webpack_require__) {
-
-// extracted by mini-css-extract-plugin
-
-/***/ }),
-
 /***/ "9bf2":
 /***/ (function(module, exports, __webpack_require__) {
 
@@ -15149,43 +15149,42 @@ var button_component = normalizeComponent(
 )
 
 /* harmony default export */ var components_button = (button_component.exports);
-// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"75d8bda1-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./packages/components/tabs/index.vue?vue&type=template&id=430e7741
-var tabsvue_type_template_id_430e7741_render = function render() {
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"75d8bda1-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./packages/components/tabs/index.vue?vue&type=template&id=6cfdbc71
+var tabsvue_type_template_id_6cfdbc71_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('div', {
     staticClass: "vd-tabs",
     class: _vm.stickyClasses
   }, [_c('div', {
-    ref: "tabsWrap",
+    ref: "wrap",
     staticClass: "vd-tabs__wrap",
     class: _vm.menuClasses
   }, [_c('div', {
-    ref: "tabsContainer",
+    ref: "nav",
     staticClass: "vd-tabs__nav",
     class: [_vm.barType, _vm.scrollspy]
-  }, _vm._l(_vm.navList, function (item, index) {
+  }, _vm._l(_vm.tabs, function (tab, index) {
     return _c('div', {
-      key: index,
-      class: [_vm.tabClasses(item), _vm.lineClasses],
+      key: tab.name !== undefined ? tab.name : index,
+      ref: "tabItems",
+      refInFor: true,
+      class: [_vm.tabClasses(tab, index), _vm.lineClasses],
       on: {
         "click": function ($event) {
-          return _vm.handleChange(index);
+          return _vm.onClick(tab, index);
         }
       }
     }, [_c('span', {
-      staticClass: "vd-tabs-text-cell",
+      ref: "title",
+      refInFor: true,
+      staticClass: "vd-tab__text",
       class: _vm.ellipsisClasses
-    }, [_vm._v(" " + _vm._s(item.title) + " "), item.arrow ? _c('vd-icon', {
-      staticClass: "vd-tabs-arrow",
-      attrs: {
-        "name": "icon_btn_moredown"
-      }
-    }) : _vm._e()], 1)]);
+    }, [_vm._v(" " + _vm._s(tab.title) + " ")])]);
   }), 0), _vm.menu ? _c('div', {
-    staticClass: "vd-tabs-menu--right"
+    staticClass: "vd-tabs__menu--right"
   }, [_c('vd-icon', {
-    staticClass: "vd-tabs-menu-btn",
+    staticClass: "vd-tabs__menu--btn",
     attrs: {
       "name": _vm.menuIconComputed
     },
@@ -15193,12 +15192,19 @@ var tabsvue_type_template_id_430e7741_render = function render() {
       "click": _vm.emitMenuClick
     }
   })], 1) : _vm._e()]), _c('div', {
-    staticClass: "vd-tabs__content"
-  }, [_vm._t("default")], 2)]);
+    ref: "content",
+    staticClass: "vd-tabs__content",
+    class: {
+      'vd-tabs__content--animated': _vm.animated
+    }
+  }, [_vm.animated ? _c('div', {
+    class: _vm.trackClasses,
+    style: _vm.trackStyle
+  }, [_vm._t("default")], 2) : _vm._t("default")], 2)]);
 };
-var tabsvue_type_template_id_430e7741_staticRenderFns = [];
+var tabsvue_type_template_id_6cfdbc71_staticRenderFns = [];
 
-// CONCATENATED MODULE: ./packages/components/tabs/index.vue?vue&type=template&id=430e7741
+// CONCATENATED MODULE: ./packages/components/tabs/index.vue?vue&type=template&id=6cfdbc71
 
 // EXTERNAL MODULE: ./node_modules/core-js/modules/es.array.push.js
 var es_array_push = __webpack_require__("14d9");
@@ -15218,7 +15224,6 @@ const prefixCls = "vd-tabs";
       type: String,
       default: "primary"
     },
-    // 将 menu 作为一个字段，同时控制显示和图标名称
     menu: {
       type: [Boolean, String],
       default: false
@@ -15231,30 +15236,44 @@ const prefixCls = "vd-tabs";
     backgroundColor: Boolean,
     divider: Boolean,
     sticky: Boolean,
-    lazyRender: Boolean
+    lazyRender: Boolean,
+    animated: Boolean
   },
   data() {
     return {
-      currentValue: this.value,
-      // 当前选中的标签名
-      navList: [],
-      // 标签导航列表
-      tabs: [] // 已注册的标签
+      tabs: [],
+      currentName: this.value !== undefined ? this.value : 0 // 默认为 0
     };
   },
   watch: {
     // 监听 value 变化，更新 currentValue
     value(val) {
-      this.currentValue = val;
+      this.currentName = val;
+      this.setCurrentName(val);
     }
   },
   computed: {
+    trackClasses() {
+      return {
+        'vd-tabs__track': true
+      };
+    },
+    trackStyle() {
+      const activeIndex = this.tabs.findIndex((tab, index) => {
+        return this.isTabActive(tab, index);
+      });
+      const translateX = -activeIndex * 100;
+      return {
+        transform: `translateX(${translateX}%)`,
+        transitionDuration: '0.3s'
+      };
+    },
     // 计算菜单按钮的图标，根据 menu 属性的类型决定图标
     menuIconComputed() {
-      if (typeof this.menu === 'string') {
+      if (typeof this.menu === "string") {
         return this.menu;
       } else {
-        return 'icon_tab_morelist'; // 默认的菜单图标名称
+        return "icon_tab_morelist"; // 默认的菜单图标名称
       }
     },
     // 计算滚动监视的类名
@@ -15264,13 +15283,13 @@ const prefixCls = "vd-tabs";
     // 计算标签文字是否需要省略号的类名
     ellipsisClasses() {
       return {
-        [`${prefixCls}-text--ellipsis`]: this.ellipsis
+        [`vd-tab__text--ellipsis`]: this.ellipsis
       };
     },
     // 计算标签包裹器的类名，根据 menu、backgroundColor 和 divider 属性来确定
     menuClasses() {
       return {
-        [`${prefixCls}-menu`]: this.menu,
+        [`${prefixCls}__menu`]: this.menu,
         [`${prefixCls}__wrap--bg`]: this.backgroundColor,
         "vd-hairline--bottom": this.divider
       };
@@ -15278,13 +15297,13 @@ const prefixCls = "vd-tabs";
     // 计算标签下方线条的类名
     lineClasses() {
       return {
-        [`${prefixCls}__line`]: !this.actBorder
+        [`vd-tab__none--line`]: !this.actBorder
       };
     },
     // 根据 tabsType 属性计算标签类型的类名
     barType() {
       return {
-        [`${prefixCls}-${this.tabsType}-bar`]: this.tabsType
+        [`${prefixCls}__nav--${this.tabsType}`]: this.tabsType
       };
     },
     stickyClasses() {
@@ -15296,86 +15315,126 @@ const prefixCls = "vd-tabs";
   methods: {
     // 当菜单按钮被点击时触发事件
     emitMenuClick() {
-      this.$emit('menu-click');
+      this.$emit("menu-click");
     },
     // 计算每个标签项的类名
-    tabClasses(item) {
+    tabClasses(tab, index) {
+      const isActive = this.isTabActive(tab, index);
       return {
-        [`${prefixCls}-${this.tabsType}`]: true,
-        [`${prefixCls}-${this.tabsType}-active`]: item.name === this.currentValue
+        'vd-tab': true,
+        'vd-tab--active': isActive
       };
     },
-    // 注册新的标签到 tabs 数组中
-    registerTab(tab) {
-      if (!this.tabs.includes(tab)) {
-        this.tabs.push(tab);
-        this.updateNav();
+    setCurrentName(name) {
+      // 如果没有指定 name 属性，则使用索引值，确保索引值为数字类型
+      const nameIsNumber = typeof name === 'number' || /^\d+$/.test(name);
+      const parsedName = nameIsNumber ? Number(name) : name;
+      const matchedTab = this.tabs.find((tab, index) => {
+        if (tab.name !== undefined) {
+          return tab.name === parsedName;
+        } else {
+          return index === parsedName;
+        }
+      });
+      if (matchedTab) {
+        this.currentName = matchedTab.name !== undefined ? matchedTab.name : this.tabs.indexOf(matchedTab);
+      } else if (this.tabs.length > 0) {
+        const firstTab = this.tabs[0];
+        this.currentName = firstTab.name !== undefined ? firstTab.name : 0;
+      } else {
+        this.currentName = null;
       }
+      this.$emit('input', this.currentName);
     },
-    // 从 tabs 数组中注销一个标签
-    unregisterTab(tab) {
+    isTabActive(tab, index) {
+      if (tab.name !== undefined) {
+        return tab.name === this.currentName;
+      } else {
+        return index === Number(this.currentName);
+      }
+    },
+    addTab(tab) {
+      this.tabs.push(tab);
+      if (this.currentName === undefined) {
+        this.setCurrentName(tab.name !== undefined ? tab.name : 0);
+      }
+    },
+    removeTab(tab) {
       const index = this.tabs.indexOf(tab);
       if (index !== -1) {
         this.tabs.splice(index, 1);
-        this.updateNav();
-      }
-    },
-    // 根据已注册的标签更新导航列表
-    updateNav() {
-      this.navList = this.tabs.map((tab, index) => ({
-        title: tab.title,
-        name: tab.name != null ? tab.name : index,
-        arrow: tab.arrow
-      }));
-      // 如果当前没有选中的标签且导航列表不为空，则将第一个标签设为当前值
-      if (!this.currentValue && this.navList.length) {
-        this.currentValue = this.navList[0].name;
-        this.$emit("input", this.currentValue);
-      }
-    },
-    handleChange(index) {
-      const nav = this.navList[index];
-      const name = nav.name;
-      if (this.currentValue !== name) {
-        this.currentValue = name;
-        this.$emit("input", name); // 触发 input 事件，更新父组件中的 v-model 绑定值
-        this.$emit("change", {
-          index,
-          title: nav.title,
-          name
-        }); // 触发 change 事件，传递标签的详细信息
-        this.adjustTabPosition(index); // 调整选中标签的位置
-      }
-      this.$emit("click", {
-        index,
-        title: nav.title,
-        name
-      }); // 触发 click 事件，传递标签的详细信息
-    },
-    adjustTabPosition(index) {
-      const container = this.$refs.tabsContainer;
-      const selectedTab = container.children[index];
-      if (selectedTab) {
-        const containerWidth = container.offsetWidth;
-        const tabWidth = selectedTab.offsetWidth;
-        const tabOffsetLeft = selectedTab.offsetLeft;
-        const scrollLeft = tabOffsetLeft - (containerWidth - tabWidth) / 2;
-        container.scrollTo({
+      }
+    },
+    onClick(tab, index) {
+      if (tab.disabled) {
+        this.$emit('disabled', tab.name !== undefined ? tab.name : index, index);
+      } else {
+        this.currentName = tab.name !== undefined ? tab.name : index;
+        // 如果 currentName 是索引值，确保为数字类型
+        if (tab.name === undefined) {
+          this.currentName = Number(this.currentName);
+        }
+        this.$emit('input', this.currentName);
+        this.$emit('change', this.currentName, index);
+        // 切换标签后，滚动到当前标签
+        this.$nextTick(() => {
+          this.scrollToActiveTab();
+        });
+      }
+    },
+    scrollToActiveTab() {
+      const scrollWrapper = this.$refs.nav; // 修改这里
+      const tabItems = this.$refs.tabItems;
+      if (!scrollWrapper || !tabItems || tabItems.length === 0) {
+        return;
+      }
+      const activeIndex = this.tabs.findIndex((tab, index) => {
+        return this.isTabActive(tab, index);
+      });
+      const activeTab = tabItems[activeIndex];
+      if (activeTab) {
+        const tabOffsetLeft = activeTab.offsetLeft;
+        const tabWidth = activeTab.offsetWidth;
+        const wrapperWidth = scrollWrapper.offsetWidth;
+        const scrollLeft = tabOffsetLeft - (wrapperWidth - tabWidth) / 2;
+        scrollWrapper.scrollTo({
           left: scrollLeft,
-          behavior: "smooth"
+          behavior: 'smooth'
         });
       }
+    },
+    renderTitle(titleEl, tab) {
+      this.$nextTick(() => {
+        const index = this.tabs.indexOf(tab);
+        if (index !== -1 && this.$refs.title && this.$refs.title[index]) {
+          const navTitleEl = this.$refs.title[index];
+          // 清空导航标题元素的内容
+          navTitleEl.innerHTML = '';
+          // 将子组件的 title 插槽内容移动到导航标题元素中
+          while (titleEl.firstChild) {
+            navTitleEl.appendChild(titleEl.firstChild);
+          }
+        }
+      });
     }
   },
   mounted() {
-    // 组件挂载后更新导航列表
-    // this.updateNav();
+    if (this.currentName !== undefined) {
+      this.setCurrentName(this.currentName);
+    } else if (this.tabs.length > 0) {
+      const firstTab = this.tabs[0];
+      this.currentName = firstTab.name !== undefined ? firstTab.name : 0;
+    }
+    // 初始加载时，滚动到当前激活的标签
+    this.$nextTick(() => {
+      this.scrollToActiveTab();
+    });
   }
 });
 // CONCATENATED MODULE: ./packages/components/tabs/index.vue?vue&type=script&lang=js
  /* harmony default export */ var components_tabsvue_type_script_lang_js = (tabsvue_type_script_lang_js); 
-// EXTERNAL MODULE: ./packages/components/tabs/index.vue?vue&type=style&index=0&id=430e7741&prod&lang=less
-var tabsvue_type_style_index_0_id_430e7741_prod_lang_less = __webpack_require__("1925");
+// EXTERNAL MODULE: ./packages/components/tabs/index.vue?vue&type=style&index=0&id=6cfdbc71&prod&lang=less
+var tabsvue_type_style_index_0_id_6cfdbc71_prod_lang_less = __webpack_require__("230a");
 
 // CONCATENATED MODULE: ./packages/components/tabs/index.vue
 
@@ -15388,8 +15447,8 @@ var tabsvue_type_style_index_0_id_430e7741_prod_lang_less = __webpack_require__(
 
 var tabs_component = normalizeComponent(
   components_tabsvue_type_script_lang_js,
-  tabsvue_type_template_id_430e7741_render,
-  tabsvue_type_template_id_430e7741_staticRenderFns,
+  tabsvue_type_template_id_6cfdbc71_render,
+  tabsvue_type_template_id_6cfdbc71_staticRenderFns,
   false,
   null,
   null,
@@ -15398,73 +15457,104 @@ var tabs_component = normalizeComponent(
 )
 
 /* harmony default export */ var tabs = (tabs_component.exports);
-// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"75d8bda1-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./packages/components/tab/index.vue?vue&type=template&id=2c2d2daf
-var tabvue_type_template_id_2c2d2daf_render = function render() {
+// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"75d8bda1-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./packages/components/tab/index.vue?vue&type=template&id=6808f4f4
+var tabvue_type_template_id_6808f4f4_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('div', {
-    class: _vm.tabClasses
-  }, [_vm.shouldRender ? _vm._t("default") : _vm._e()], 2);
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: _vm.shouldShow,
+      expression: "shouldShow"
+    }],
+    class: _vm.paneClasses
+  }, [_vm.shouldRender ? _vm._t("default") : _vm._e(), _vm.$slots.title ? _c('div', {
+    ref: "title"
+  }, [_vm._t("title")], 2) : _vm._e()], 2);
 };
-var tabvue_type_template_id_2c2d2daf_staticRenderFns = [];
+var tabvue_type_template_id_6808f4f4_staticRenderFns = [];
 
-// CONCATENATED MODULE: ./packages/components/tab/index.vue?vue&type=template&id=2c2d2daf
+// CONCATENATED MODULE: ./packages/components/tab/index.vue?vue&type=template&id=6808f4f4
 
 // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./packages/components/tab/index.vue?vue&type=script&lang=js
 /* harmony default export */ var tabvue_type_script_lang_js = ({
   name: 'vd-tab',
   props: {
     name: [String, Number],
-    title: {
-      type: String
-    },
-    arrow: {
-      type: Boolean,
-      default: false
-    }
+    title: String
   },
   data() {
     return {
-      isRendered: false
+      parent: null,
+      inited: false
     };
   },
-  watch: {
-    isActive(newVal) {
-      if (newVal && !this.isRendered) {
-        this.isRendered = true;
-      }
-    }
-  },
   computed: {
-    isActive() {
-      return this.computedName === this.$parent.currentValue;
-    },
-    tabClasses() {
+    paneClasses() {
       return {
-        'vd-tab': true,
-        'vd-tab-active': this.isActive
+        'vd-tab__pane': true
       };
     },
-    computedName() {
-      return this.name != null ? this.name : this.$parent.tabs.indexOf(this);
-    },
-    shouldRender() {
-      if (this.$parent.lazyRender) {
-        return this.isRendered || this.isActive;
+    isActive() {
+      if (!this.parent) return false;
+      if (this.name !== undefined) {
+        return this.name === this.parent.currentName;
       } else {
-        return true;
+        const index = this.parent.tabs.indexOf(this);
+        return index === Number(this.parent.currentName);
       }
     },
-    computedTitle() {
-      // Since the title slot is now handled by vd-tabs, we return the title prop
-      return this.title;
+    shouldShow() {
+      // 当 animated 为 true 时，所有标签页都需要渲染（用于动画效果）
+      // 当 animated 为 false 时，只渲染当前激活的标签页
+      return this.isActive || this.parent && this.parent.animated;
+    },
+    shouldRender() {
+      return this.inited || !(this.parent && this.parent.lazyRender);
+    }
+  },
+  watch: {
+    isActive(val) {
+      if (val) {
+        this.inited = true;
+      }
     }
   },
   created() {
-    this.$parent.registerTab(this);
+    this.parent = this.findParent('vd-tabs');
+    if (this.parent) {
+      this.parent.addTab(this);
+    } else {
+      console.error('vd-tab must be used within vd-tabs.');
+    }
+  },
+  mounted() {
+    if (this.isActive) {
+      this.inited = true;
+    }
+    // 如果存在 title 插槽，调用父组件的 renderTitle 方法
+    if (this.$slots.title && this.$refs.title) {
+      this.parent.renderTitle(this.$refs.title, this);
+      this.$refs.title.parentNode.removeChild(this.$refs.title);
+    }
   },
   beforeDestroy() {
-    this.$parent.unregisterTab(this);
+    if (this.parent) {
+      this.parent.removeTab(this);
+    }
+  },
+  methods: {
+    findParent(name) {
+      let parent = this.$parent;
+      while (parent) {
+        if (parent.$options && parent.$options.name === name) {
+          return parent;
+        }
+        parent = parent.$parent;
+      }
+      return null;
+    }
   }
 });
 // CONCATENATED MODULE: ./packages/components/tab/index.vue?vue&type=script&lang=js
@@ -15479,8 +15569,8 @@ var tabvue_type_template_id_2c2d2daf_staticRenderFns = [];
 
 var tab_component = normalizeComponent(
   components_tabvue_type_script_lang_js,
-  tabvue_type_template_id_2c2d2daf_render,
-  tabvue_type_template_id_2c2d2daf_staticRenderFns,
+  tabvue_type_template_id_6808f4f4_render,
+  tabvue_type_template_id_6808f4f4_staticRenderFns,
   false,
   null,
   null,
@@ -20822,6 +20912,8 @@ var toast_component = normalizeComponent(
 
 
 
+
+let queueResult = [];
 function getType(value) {
   if (value !== value) return 'NaN';
   return Object.prototype.toString.call(value).slice(8, -1).toLowerCase();
@@ -20876,12 +20968,22 @@ class toast_VdToast extends vue_runtime_esm["a" /* default */].extend(components
     this.isShow = false;
     if (inBrowser && this.vm.$el) {
       setTimeout(() => {
-        this.vm.$el.parentNode.removeChild(this.vm.$el);
+        this.vm.$el.parentNode && this.vm.$el.parentNode.removeChild(this.vm.$el);
       }, 500);
     }
   }
 }
-const Toast = options => new toast_VdToast(options);
+const Toast = options => {
+  const NewOption = new toast_VdToast(options);
+  queueResult.push(NewOption);
+  return NewOption;
+};
+Toast.clear = () => {
+  queueResult.forEach(toast => {
+    toast.clear();
+  });
+  queueResult = [];
+};
 /* harmony default export */ var packages_components_toast = (Toast);
 // CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"75d8bda1-vue-loader-template"}!./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/loaders/templateLoader.js??ref--6!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader/lib??vue-loader-options!./packages/components/footer/index.vue?vue&type=template&id=2c9567c1
 var footervue_type_template_id_2c9567c1_render = function render() {