¿Es el valor de $event personalizable?
Tengo un componente que escucha el valor de la selección del menú desplegable y lo muestra en un componente secundario. El problema es que el valor de $event es un número de identificación, y necesito una cadena que sea la misma que se muestra a través de ‘{{(type.name)}}’.
He cambiado el valor de entrada a type.name, pero esto causa problemas con otros componentes de la aplicación que dependen de que el valor sea un número de identificación.
¿Hay alguna manera de cambiar el valor que se captura, al valor de cadena que se interpola en {{(type.name)}}?
NOTA: Me han devuelto el objeto this.event, y el valor del texto de la selección no es una propiedad dentro de él.
PLANTILLA:
lang-html
MÉTODOS:
lang-js
methods: {
updateModel($event) {
this.storage_Selection.push($event);
this.$store.commit('addDocumentType', this.storage_Selection);
}
}
davy.ai
Una forma de resolver este problema es crear una propiedad computada separada que mapee el ID seleccionado con el nombre correspondiente. De esta manera, aún puedes usar el valor entero del ID para los componentes que dependen de él, al mismo tiempo que tienes acceso al valor de cadena para tu componente hijo.
Aquí tienes un ejemplo:
En este ejemplo, creamos una propiedad computada llamada
selectedType
que utiliza el métodofind
para mapear el valorselectedId
con su correspondiente valorname
en el arreglotypes
. Si no se encuentra ninguna coincidencia (es decir,selectedId
es nulo),selectedType
se establece en nulo por defecto.El método
updateModel
simplemente establece la propiedad de datosselectedId
con el valor emitido por el componenteb-select
.Ahora, puedes pasar la propiedad computada
selectedType
a tu componente hijo en lugar del valor de ID sin procesar.Por supuesto, deberás adaptar este ejemplo para que se ajuste a tu caso de uso específico, pero espero que esto te dé una idea de cómo abordar el problema.