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?
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; } }