原因：当浏览器刷新后，v-model绑定的数据也会重置，所以选中的状态会丢失
解决办法
方法一
切换tab会造成路由切换的情况：可以取得路由的name，若路由的name为空，则说明没有点击过。就使用||设置一个默认值。若不为空1，则直接取到name
<template>
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="User" name="first">User</el-tab-pane>
<el-tab-pane label="Config" name="second">Config</el-tab-pane>
</template>
<script lang="ts" setup>
import {ref, reactive} from "vue"
import { useRouter ,useRoute} from "vue-router"
const router = useRouter()
const route = useRoute()
//tab栏选中的
const activeName = ref(route.name||'first') //若没有点击过，就默认展示第一个
const handleClick = (tab: TabsPaneContext) => {
router.push({
name: tab.paneName as string
})
}
</script>方法二
没有使用路由，切换tab只是内容的渲染。
可以把选中状态储存到sessionStorage本地。