1

Hola estoy comenzando en este mundo y tengo un duda, como hago para pasarle el valor del v-switch a un metodo si este posee un arreglo asociado, este es mi codigo para ver si lo entienden:

este es mi switch, posee un valor false por defecto, quiero que al activar el switch, llame a un evento y le envie el valor que esta tomando:

            <v-switch
              v-model="anyPromo.activar"
              label="Activar promción"
              @change="changeState(value)"
            ></v-switch>

luego en el export esta asi:

export default {
  data() {
    return {
      anyPromo: {
        activar: false
}

y el metodo esta de esta fomra:

methods:{
    changeState(valor) {
        console.log("Switch "+valor);
     
    }
}

pero no me funciona, disculpen los errores apenas comienzo en este mundo, de antemano gracias...

9
  • anyPromo.activar cambia el valor solo dependiendo de lo que tenga el switch... no tenes que hacer nada al respecto.. esa es la filosofia de vue... o no entendiste como funciona vue, o yo no entiendo que tratas de hacer...
    – gbianchi
    el 23 oct. 2020 a las 16:07
  • como se el valor nuevo que esta tomando el switch????
    – rrodo1310
    el 23 oct. 2020 a las 16:17
  • esta dentro de la variable conectada al switch por el v-model... no lo ves cambiar en el depurador?
    – gbianchi
    el 23 oct. 2020 a las 16:18
  • No, por eso mi duda, me trae undefined...
    – rrodo1310
    el 23 oct. 2020 a las 16:22
  • no tenes algun error en la consola?
    – gbianchi
    el 23 oct. 2020 a las 16:23

2 respuestas 2

0

Necesitas dar value a changeState como: (value) => changeState(value). También debes recordar envolver tu aplicación en <v-app> para que el switch funcione.

<template>
  <div>
    <v-switch
      :v-model="anyPromo.activar"
      :input-value="anyPromo.activar"
      label="Activar promción"
      @change="(value) => changeState(value)"
    ></v-switch>
  </div>
</template>

<script>
export default {
  data() {
    return {
      anyPromo: {
        activar: true,
      },
    };
  },
  methods: {
    changeState(valor) {
      this.anyPromo.activar = valor;
      console.log("Switch " + valor);
    },
  },
};
</script>

Aquí tienes una demo que funciona.

2
  • gracias...muy amable
    – rrodo1310
    el 23 oct. 2020 a las 17:41
  • 1
    esa es mejor muchas gracias
    – rrodo1310
    el 23 oct. 2020 a las 18:15
0

Hola gracias aqui la respuesta por si le sirve a alguien...

en el v-switch agregar este codigo:

   @change="toggleActive(anyPromo)"

y aqui el metodo:

   toggleActive(value){
   
      console.log('valor nuevo',value.activar)
    },

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.