Select selector multi-select function in vue element-ui

The multi-selection function is no problem according to the official writing method of elementui, it is very simple => https://element.eleme.cn/#/zh-CN/component/select
here to record a bug encountered in the project⬇️

When performing multiple selections, after canceling the multiple selections, click on the option just canceled again, two identical tags appear, and an id repetition error is reported; but directly click the small cross on the tag and add it, and it will not appear repeatedly.

After checking over and over again, I found that a @removeTag was bound to the selector, and I wrote a method to delete the tag, but the logic in the @change method did not delete this action, so I added the logic:

1. Inside the selector:

<el-form-item label="" >
          <el-select
            v-model="model_datasets_name"
            multiple
            placeholder="请选择"
            class="selectAttr"
            @change="changeSelectedDataSet"  //检测选择器内选择的内容变化
            @remove-tag="removeTag"  //点击tag上的小叉叉会触发
          >
            <el-option
              v-for="(item, index) in dataset_options"
              :key="`dataset_${index}`"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>

2. Method:

 // 下拉框：更改选择的数据集时触发
    changeSelectedDataSet(e) {
      const old_length = this.oldSelected.length  //旧选择
      const new_length = this.model_datasets_name.length  //新选择
      if (new_length > old_length) {
        const add_dataset_name = this.model_datasets_name[new_length - 1]
        this.addDataset(add_dataset_name) //功能接口
      }else{
      //以下为新增代码
        this.oldSelected.forEach(ele =>{
          if(ele !== this.model_datasets_name[0]){
            this.removeTag(ele)  //删除
          }
        })
      }
      //以上
      this.oldSelected = e
    },
    
// 在多选框中删除 tag（别人之前写的删除功能，我没动）
    async removeTag(e) {
      const { uuid } = this.midDatasets.find(item => item.midDatasetName === e)
      const index = this.midDatasets.findIndex(
        item => item.midDatasetName === e
      )
      const res = await midDataset_delete(uuid)
      if (res.code === 0) {
        this.$message({
          message: res.msg,
          type: 'success'
        })
        this.midDatasets.splice(index, 1)

        if (e === this.activeTagName) {
          const data = this.midDatasets.find(item => item.midDatasetName !== e)
          if (data && data.midDatasetName) {
            this.activeTagName = data.midDatasetName
            this.handleTagClick()
          }
        }
      } else {
        this.$message({
          message: res.msg,
          type: 'error'
        })
      }
    },