vue使用$emit传递参数方式

this.$emit('getData','abcd')

<child @getData="getData"></child>
getData(data){
	console.log(data) // 'abcd'
}

let obj = {
	data1: 'abcd',
	data2: 'abcdefg'
}
this.$emit('getData',obj)

<child @getData="getData"></child>
getData(data){
	console.log(data) // {data1:'abcd',data2:'abcdefg'}
}

this.$emit('getData','abcd','abcdefg')

<child @getData="getData(arguments)"></child>
getData(data){
	console.log(data[0],data[1]) // 'abcd' 'abcdefg'
}

  <div>
    <!-- 1 给子组件绑定一个点击事件 -->
    <el-button type="primary" size="small" @click="btnFn">我是子组件</el-button>
  </div>
</template>

<script>
export default {
  methods: {
    // 2 声明事件处理函数
    btnFn() {
      console.log("点击到了");
      // 3 子传父
      // 执行$emit函数，会调用父组件中名为sonEvent的函数再将"hello world"的值传过去
      this.$emit("sonEvent", "hello world");
    },
  },
};
</script>

  <div id="app">
    <!-- 4 接收子传父 @inputFn="fatInput" -->
    <!-- @sonEvent 与子组件this.$emit('sonEvent',...)起的名字一致 -->
    <son @sonEvent="sonFn"></son>
  </div>
</template>

<script>
import son from "./components/son.vue";
export default {
  name: "app",
  components: {
    son,
  },
  methods: {
    // 5 接收参数
    sonFn(data) {
      console.log(data);
    },
  },
};
</script>