在vue开发中子组件与父组件通信，父组件常使用事件处理函数的方式来获取子组件参数

// 子组件 my-button按钮// 父组件
    
     
      methods: {    clickHandle(str) {        console.log(str)    }}复制代码
     
    

当子组件内部按钮点击时，对外派发一个click事件，父组件监听这个click事件，并绑定对应的事件处理函数，就能获取到子组件内部抛出的数据

实际开发中，有时我们希望能在事件处理函数中传入父组件内部的数据

// 子组件 my-button按钮// 父组件
    
     
      methods: {    clickHandle(str, parentStr) {        console.log(str)        console.log(parentStr)    }}复制代码
     
    

但是以上方法并不可取，父组件在事件处理函数中传入的参数会覆盖掉子组件抛出的数据，若父组件内str未定义还会抛出异常。

正确的传参方式

// 子组件 my-button按钮// 父组件
    
     
      methods: {    clickHandle(arguments, parentStr) {        console.log(arguments[0])        console.log(parentStr)    }}复制代码
     
    

vue提供了一种方案，在事件处理函数中设置第一个参数为arguments，它会接收子组件内抛出的所有数据，子组件抛出的数据都会存储在arguments中，后面的参数可任意传入父组件内部的数据