Element UI tabs标签页实现鼠标悬浮切换

将 Element UI tabs标签页默认的点击切换改成鼠标悬浮就自动点击（实现类似hover切换的效果）

前提: chatgp 跟我说 telement ui 有自带的悬停切换功能, 使用 <el-tabs tab-position="top" tab-hover> 实现, 但是经测试无效, 可能跟版本有关吧, 所以直接自己写个通用的实现方法得了

话不多说, 直接上代码

<el-tabs ref="自定义ref名称" v-model="Active">
    <!-- 👇 el-tab-pane 中不要使用自定义的 name -->
    <el-tab-pane v-for="(item, index) in Tabs" :key="index" :label="item.label">
        {{item}}
    </el-tab-pane>
</el-tabs>

mounted() {
    this.$nextTick(() => {
        this.$refs.自定义ref名称.$refs.nav.$nextTick(() => {
            // 此时 el-tab 的 nav 才渲染, 才能拿到 el-tabs__item 👇
            var tabs = document.getElementsByClassName("el-tabs__item");
            let that = this;
            for (let i = 0; i < tabs.length; i++) {
                tabs[i].addEventListener("mouseover", () => {
                    that.$refs.自定义ref名称.handleTabClick(1, String(i));
                })
            }
        })
    })
},