element ui的el-select__tags自定义

删除标签的方法是什么？

对于element ui的el-select__tags组件，你可以自定义删除标签的方法，方法如下：

1.给el-select__tags组件添加ref属性；

2.在mounted生命周期方法中获取该组件；

3.使用removeTag(index)方法移除指定位置的标签。

代码示例：

<el-select
ref="selectTag"
multiple
v-model="selectedTags"
filterable
remote
:remote-method="remoteMethod"
:loading="loading"
:disabled="disabled"
:popper-append-to-body="false"
class="demo-select">

<template slot="tags" slot-scope="{tag, removeTag}">
<el-tag
class="tag"
:key="tag.name"
closable
@close="removeTag(tag)">
{{ tag.name }}
</el-tag>
</template>

<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
<span style="float: left">{{ item.label }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.desc }}</span>
</el-option>

</el-select>

// 在mounted生命周期中获取该组件
mounted() {
this.selectTag = this.$refs.selectTag;
},

// 删除标签的方法
removeTag(tag) {
const index = this.selectedTags.indexOf(tag);
if (index !== -1) {
this.selectedTags.splice(index, 1);
this.selectTag.removeTag(index); // 调用组件自带的removeTag方法
}
}