【Element-UI-Tabs 标签页-后面加按钮】

Element-UI-Tabs 标签页-后面加按钮

效果如图所示：

代码实现如下：

<el-tabs v-model="activeName" type="border-card" :before-leave="beforeLeave">
    <el-tab-pane name="first">
        <span slot="label" ><i class="el-icon-date">i> 个人信息span>
        个人信息
    el-tab-pane>
    <el-tab-pane name="second">
        <span slot="label"><i class="el-icon-date">i> 更改手机号span>
        更改手机号
    el-tab-pane>
    <el-tab-pane name="third">
        <span slot="label"><i class="el-icon-date">i> 修改密码span>
        修改密码
    el-tab-pane>
    <el-tab-pane name="fourth">
        <span slot="label"><i class="el-icon-date">i> 人脸识别span>
        人脸识别
    el-tab-pane>
    <el-tab-pane name="CustoBtn">
        <span slot="label"><el-link type="primary" :underline="false">完善信息el-link>span>
    el-tab-pane>
el-tabs>

export default {
    data() {
        return {
             activeName: 'first'
        }
    },
    methods: {
        beforeLeave(tabName) {
            if(tabName== "CustoBtn") {
                return false;
            }
        },
    },
}