vue3 props传值

在Vue3中，可以通过props属性将数据从父组件传递给子组件。具体步骤如下：

1. 在父组件中定义props属性，指定要传递的数据类型和默认值（可选）。

例如：

<template>
  <child-component :prop1="data1" :prop2="data2"></child-component>
</template>

<script>
import ChildComponent from './ChildComponent.vue'

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      data1: 'Hello',
      data2: 'Vue3'
    }
  }
}
</script>

2. 在子组件中通过props接收父组件传递的数据。

例如：

<template>
  <div>{{ prop1 }} {{ prop2 }}</div>
</template>

<script>
export default {
  props: {
    prop1: {
      type: String,
      default: ''
    },
    prop2: {
      type: String,
      default: ''
    }
  }
}
</script>

这样就完成了从父组件向子组件传递数据的操作。在子组件中，通过props属性接收父组件传递的数据，并在模板中使用即可。注意，props属性是只读的，不能在子组件中修改其值。