element ui tabs标签页动态增加标签页,标签页引用组件

template模板:

<el-tabs v-model="editableTabsValue" type="border-card" @edit="removeTab" closable style="height: 100%;">
    <el-tab-pane :key="item.name" v-for="(item) in editableTabs" :label="item.title" :name="item.name">
        <tab-component :is=item.content></tab-component>
    </el-tab-pane>
</el-tabs>

引入组件:

import tableTab from '@/components/main/tabs/TableTab'

并作为子组件

components: {
      tableTab
    }

标签数据中,使用组件作为内容

editableTabs: [{
    title: '对象',
    name: '1',
    content: 'tableTab'
}]
原文地址:https://www.cnblogs.com/jimmy2019/p/14084828.html