Después de seleccionar el-radio en element plus, haga clic nuevamente para cancelar la selección

El requisito de demanda es una operación de selección única, haga clic nuevamente para desmarcar el
modificador de eventos en Vue:
1.prevenir: evitar el evento predeterminado,
2.detener: evitar que el evento burbujee,
3.una vez: el evento solo se activa una vez;
4.capture: use El modo de captura del evento
5.self: el evento solo se activa cuando event.target es el elemento de la operación actual;
código

 <div>
   <el-radio-group v-model="ruleForm.radio2">
      <el-radio :label="'FACE'"
                @click.prevent="radioChange('FACE')">面容</el-radio>
      <el-radio :label="'FINGERPRINT'"
                @click.prevent="radioChange('FINGERPRINT')">指纹</el-radio>
      <el-radio :label="'IC'"
                @click.prevent="radioChange('IC')">刷卡
    </el-radio-group>
  </div>

codigo js

 const radioChange = (e) => {
    
    
    e === data.ruleForm.radio2 ? (data.ruleForm.radio2 = "") : (data.ruleForm.radio2 = e);
  }

Escrito en vue2
(el modificador .native se eliminó en vue3)

<div>
  <el-radio-group v-model="ruleForm.radio2">
      <el-radio :label="'FACE'"
                @click.native.prevent="radioChange('FACE')">面容</el-radio>
      <el-radio :label="'FINGERPRINT'"
                @click.native.prevent="radioChange('FINGERPRINT')">指纹</el-radio>
      <el-radio :label="'IC'"
                @click.native.prevent="radioChange('IC')">刷卡
    </el-radio-group>
  </div>
radioChange = (e) => {
    
    
      e === this.ruleForm.radio2 ? (this.ruleForm.radio2 = "") : (this.ruleForm.radio2 = e);
}

Supongo que te gusta

Origin blog.csdn.net/m0_49016709/article/details/128789737
Recomendado
Clasificación