No elemento pai recebemos o evento do elemento filho, e a nomenclatura da propriedade que recebe o evento ficou com "adicionar-ingrediente", tanto que foi uma sugestão de auto complete do visual studio. Eu só não entendi o porque que ficou com esse nomenclatura se a gente definiu no filho como "adicionarIngrediente" no elemento filho.
Podemos alterar o nome dessa propriedade "@adicionar-ingrediente" ou tem que ser esse nome por algum motivo?
elemento filho: methods:{ aoClicar(){ this.selecionado = !this.selecionado;
if(this.selecionado){
this.$emit('adicionarIngrediente', this.ingrediente);
}
}
}, emits: ['adicionarIngrediente']
<button class="ingrediente" @click="aoClicar()" :aria-pressed="selecionado">
Elemento pai: <IngredienteSelecionavel :ingrediente="ingrediente" @adicionar-ingrediente="$emit('adicionarIngrediente', $event)"/>
