Quiero tener un mensaje de confirmación al hacer clic en un botón de radio, solo cuando se confirme, quiero que se verifique. Ahora tengo la alarma, pero cuando se niega, todavía verifica la que se hizo clic. ¿Existe la posibilidad de ponerlo en el método?
Aquí está el código para los botones de radio:
<div class="grid grid-cols-2 m-10 max-w-md mx-auto"> <div class="relative"> <input class="sr-only peer" type="radio" value="A" name="answer" id="answer_a" @click="methodA()" checked> <label class="flex justify-center text-white font-bold py-3 px-2 bg-lightGray rounded-l-lg cursor-pointer peer-checked:bg-darkgreen " for="answer_a">A</label> </div> <div class="relative"> <input class="sr-only peer" type="radio" value="B" name="answer" id="answer_SP" @click="methodB()"> <label class="flex justify-center text-white font-bold py-3 px-2 bg-lightGray rounded-r-lg cursor-pointer peer-checked:bg-darkgreen" for="answer_b">B</label> </div> </div>Y aquí están los métodos para las alarmas:
async methodA() { VueSimpleAlert.confirm("Are you sure you want to select A?", "Warning", "question", {}) .then(async confirmed => { if (confirmed) { this.bouleanA = true; this.$refs.answer_A.checked = false; this.$refs.answer_B.checked = true; } else { this.bouleanA = false; this.$refs.answer_A.checked = true; this.$refs.answer_B.checked = false; } }) }, async methodB(){ VueSimpleAlert.confirm("Are you sure you want to select A?", "Warning", "question", { }) .then(async confirmed => { if (confirmed) { this.bouleanA = false; this.$refs.answer_A.checked=true; this.$refs.answer_B.checked= false; }else { this.bouleanA = true; this.$refs.answer_A.checked= false; this.$refs.answer_B.checked= true;} }) },la alarma funciona y al rechazar o aceptar los cambios booleanos, pero no puedo hacer que el botón de radio cambie lo que está marcado. En línea solo puedo encontrar tutoriales sobre cómo obtener un valor de radio, que no es mi problema.
¡Gracias por la ayuda!
Su código es correcto pero no ha agregado la propiedad "ref" en la etiqueta de entrada.
p.ej:
<input ref="answer_A" class="sr-only peer" type="radio" value="A" name="answer" id="answer_a" @click="methodA()" marcada>