使用 ref 管理选项卡切换的核心是用 ref(0) 初始化响应式索引，通过 @click 更新 activeindex.value 并用其控制标签类名与面板显隐，轻量直接，适合简单场景；需避免越界、异步加载时机及非数字索引等陷阱。
用 ref 管理选项卡切换的标签索引状态，核心是把当前激活项的索引（如 0、1）存为响应式变量，再通过点击事件更新它，模板中用该索引控制类名和内容显示。这种方式轻量、直接，适合简单 Tab 场景，不需要计算属性或额外状态管理。
定义并初始化 ref 索引状态
在 <script setup></script> 中用 ref 声明一个数字类型的响应式变量，初始值设为默认激活的 tab 下标（通常为 0）：
const activeIndex = ref(0)- 确保它与 tab 列表数组长度匹配，避免越界
模板中绑定点击与显示逻辑
用 v-for 渲染 tab 标签和对应面板，通过 activeIndex 控制激活态和内容可见性：
