Resumen del método de pasar uno o más parámetros al componente padre $ emit en Vue

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:

 

 

 

Supongo que te gusta

Origin blog.csdn.net/a1059526327/article/details/109004675
Recomendado
Clasificación