修改 tabs

InfernalAzazel · Nov 26, 2024 · f3fc4cc · f3fc4cc
1 parent f357e60
commit f3fc4cc
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/docs/cn/other/components/DemoProTabs.vue b/docs/cn/other/components/DemoProTabs.vue
@@ -18,9 +18,7 @@ const tabs = ref<ProTabData[]>([
   { title: '我的账户', path: '/account' },
   { title: '设置', path: '/settings' }
 ])
-// 下拉菜单选项
 
-// 定义下拉菜单选项
 const dropdownOptions = [
   {
     label: '刷新',

diff --git a/packages/k-naiveui-pro/src/components/ProTabs.vue b/packages/k-naiveui-pro/src/components/ProTabs.vue
@@ -12,11 +12,15 @@ export interface ProTabsProps {
 }
 
 defineOptions({name: 'ProTabs', inheritAttrs: false});
+defineExpose({
+  setSelected
+});
 const props = withDefaults(defineProps<ProTabsProps>(), {
   borderStyle: 'all', // 默认值为完整边框
 });
 
 const modelValue = defineModel<ProTabData[]>({default: []});
+
 const emit = defineEmits<{
   (e: 'select', path: string): void; // 选项卡切换事件
 }>();
@@ -52,6 +56,15 @@ function handleSelect(index: number) {
   selected.value = index; // 更新当前选中的索引
   emit('select', modelValue.value[index].path || ''); // 触发选中事件
 }
+
+// 设置选中的选项卡
+function setSelected(index: number) {
+  if (index >= 0 && index < modelValue.value.length) {
+    selected.value = index; // 更新选中索引
+    emit('select', modelValue.value[index]?.path || ''); // 触发选中事件
+  }
+}
+
 </script>
 
 <template>