elementUI使用v-if控制tab标签显示报错 Duplicate keys detected: 'xxx'

发布时间 2023-03-28 10:40:00作者: LeeToLee
 <el-tabs @tab-click="handleClick" v-model="activeTabName">
        <el-tab-pane v-if="" label="用户管理" name="first" ref="first" >...</el-tab-pane>
        <el-tab-pane v-if="" label="配置管理" name="second" ref="second">...</el-tab-pane>
        <el-tab-pane v-if="" label="角色管理" name="third" ref="third">...</el-tab-pane>
</el-tabs>

解决:在el-tab-pane中手动加 key

 <el-tabs @tab-click="handleClick" v-model="activeTabName">
        <el-tab-pane v-if="" :key='0' label="用户管理" name="first" ref="first" >...</el-tab-pane>
        <el-tab-pane v-if="" :key='1' label="配置管理" name="second" ref="second">...</el-tab-pane>
        <el-tab-pane v-if="" :key='2' label="角色管理" name="third" ref="third">...</el-tab-pane>
</el-tabs>