vue3实现子组件传值父组件

在Vue 3中，可以通过自定义事件来实现子组件向父组件传值。以下是一个示例：

首先，在子组件中定义一个事件，并在需要传递值的地方触发该事件：

<template>
  <div>
    <button @click="sendMessage">Send Message</button>
  </div>
</template>

<script>
export default {
  methods: {
    sendMessage() {
      this.$emit('message', 'Hello from child component');
    }
  }
};
</script>

在这个示例中，子组件中的按钮被点击时，会通过`$emit`方法触发名为`message`的自定义事件，并传递一个值`'Hello from child component'`。

然后，在父组件中监听子组件触发的自定义事件，并在回调函数中处理传递的值：

<template>
  <div>
    <ChildComponent @message="receiveMessage" />
    <p>Received Message: {{ receivedMessage }}</p>
  </div>
</template>