1. Un parámetro
Hay dos métodos principales cuando el componente secundario pasa un parámetro al componente principal
//子组件
this.$emit('itemClick',item)
Método 1: sin paréntesis
//父组件
<div id="app">
<Child @itemClick="handleItemClick"/>
</div>
methods:{
handleItemClick(item){
console.log(item)
}
}
Como puede ver, si la función de procesamiento de eventos del componente principal no está entre paréntesis, el valor pasado por el componente secundario se pasará a esta función como primer parámetro.
Método 2: use $ event para recibir
//父组件
<div id="app">
<Child @itemClick="handleItemClick($event)"/>
</div>
//以下不变
methods:{
handleItemClick(item){
console.log(item)
}
}
2. Múltiples parámetros
Cuando el componente secundario pasa varios parámetros al componente principal, cuando el componente principal los recibe, los argumentos se pasan en forma de matriz.
//子组件
this.$emit('itemClick',param1,param2)
//父组件
<div id="app">
<Child @itemClick="handleItemClick(arguments)"/>
</div>
methods:{
handleItemClick(params){
console.log(params)
console.log(params[0])
console.log(params[1])
}
}
Los resultados son los siguientes: