el-tag 超过一定数量隐藏,只显示数字
先上效果图
<div style="float: left;width: 99.5%;border: 1px solid #DCDFE6;" class="elTagClass">
<el-tag v-for="(tag,index) in tags" :key="index" closable @close="handleClose(tag)" v-show="index < numFlag">
{{tag.name}}
</el-tag>
<el-tag v-if="tags.length >= numFlag+1">
+{{tags.length - numFlag}}
</el-tag>
</div>
numFlag:4, //超出多少条隐藏
tags: [
{ name: '标签一', type: '' },
{ name: '标签二', type: 'success' },
{ name: '标签三', type: 'info' },
{ name: '标签四', type: 'warning' },
{ name: '标签五', type: 'danger' }
],
handleClose(tag) {
this.tags.splice(this.tags.indexOf(tag), 1);
console.log(tag)
},
欢迎交流