vue3的组件传值

在Vue3中，组件传值可以通过props属性实现。

首先，在父组件中定义props属性，然后将数据传递给子组件。

// Parent.vue
<template>
  <Child :message="message" />
</template>

<script>
import Child from './Child.vue';

export default {
  data() {
    return {
      message: 'Hello Vue3'
    }
  },
  components: {
    Child
  }
}
</script>

然后，在子组件中接收父组件传递的props属性。

// Child.vue
<template>
  <div>{{ message }}</div>
</template>

<script>
export default {
  props: ['message']
}
</script>

以上代码实现了父组件向子组件传递message属性，并在子组件中使用。

注意：在Vue3中，需要使用:来绑定props属性，且子组件中不再需要使用this来访问props属性，可以直接使用。另外，在子组件中也可以使用v-model来实现双向数据绑定。