1.下拉

问题描述

使用element plus下拉框，在进行切换时使用ElMessageBox.confirm()进行二次确认，确定后联动其他输入框进行变化，二次确认后，联动修改生效，但是当前下拉可选部分再次弹出。

问题展示

解决

在下拉组件中使用 :key、使用时间戳，在下拉事件中更改对应的时间戳，使下拉组件重新渲染

代码部分

<el-col :span="24">
  <el-form-item label="下拉展示问题" 
    prop="is_blacklist"
    :rules="[
      {
        required: true,
        message: '必填项不能为空',
        trigger: 'change',
      },
    ]"
  >
    <el-select v-model="formData.is_blacklist" filterable clearable placeholder="请选择" @change="handleChangeBlack" :key="timeKey">
      <el-option label="是" :value="1"/>
      <el-option label="否" :value="0"/>
    </el-select>
  </el-form-item>
</el-col>

const handleChangeBlack = value => {
  if (Number(value) === 1) {
    //二次提示部分
  } else {}
  //更新时间戳
  state.timeKey = Date.now()
}