• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

205
Vistas
Botón de radio Vue.js no reactivo

Estoy tratando de pasar el valor del botón de opción a su padre, aquí está el ejemplo:

Niño

 <template> <radio v-model="type" value="TypeOne" @change="TypeOne()"></el-radio> <radio v-model="type" value="TypeTwo" @change="TypeTwo()"></el-radio> </template> <script> export default { methods: { TypeOne() { this.$emit('input', 'TypeOne'); }, TypeTwo() { this.$emit('input', 'TypeTwo'); } } } </script>

padre

 <template> <component @input="onTypeChange"></component> <div v-show="type"></div> <div v-show="!type"></div> </template> <script> export default { data() { return { type: 'true', }; }, methods: { onTypeChange () { var TypeOne = false var TypeTwo = false if (TypeOne == TypeOne) { this.type = false; } else if (TypeTwo == TypeTwo) { this.type = true; } else { console.log('typeChanged'); return false; } } } } </script>

Estoy tratando de usar datos de radio para ocultar o mostrar algún elemento en el componente principal. en la selección inicial funciona, pero después de cambiar la selección de radio, no actualiza el padre. ¿Cómo puedo hacer que los datos de radio sean reactivos en mi caso?

about 3 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

Pasaste un parámetro cuando llamaste a this.$emit('input', 'TypeOne'); pero el método emitido no acepta un parámetro.

Agregue un parámetro en onTypeChange() y use el parámetro en su lógica

 onTypeChange (type) { if (type == 'TypeOne') { this.type = false; } else if (type == 'TypeTwo') { this.type = true; } else { console.log('typeChanged'); return false; } }
about 3 years ago · Santiago Trujillo Denunciar
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 Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda