Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

237
Vistas
Vue 3 how to attach a click function to all radio buttons and in the function tell whether I clicked the already selected button?

I have a ref object focus = ref<number>(0) bound to the value of a radio button group.

<radio-button-group v-model="focus">

and I add a watch to the ref object. Whenever the ref object's value changes (i.e. click another button), it triggers event A.

watch(focus, () => {
        A(focus' value)// it should be noted that, at this step,
//focus' value has already changed
  })

However, I want to trigger event A even if I click the already selected button. And in this situation use focus' unchanged value as A parameter.

But when I clicked the already selected button, since the ref object focus's value does not change, it would not trigger the watch.

I think if I attach a func to each radio button, and the func is like

if(clickedSameButton)
then A(focus' value) 

But I don't know how to implement the if(clickedSameButton) condition.

If I just blindly attach func as

if(clickedButton)
then A(focus' value) 

It won't work, since you can not tell whether focus' value is the old value or new value (if you clicked a different button) when the function func executes to the then branch, due to async execution of javascript.

For example, let's say focus' current value is 1, and current selected button is 1, when I click button 2, in the function described above

if(clickedButton)
then A(focus' value) 

You cannot know if 1 or 2 is passed to A

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda