vue3props传值setup

在 Vue 3 中，可以使用 `setup` 函数来传递 props。具体步骤如下：

1. 在组件中定义 props：

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

<script>
  export default {
    props: {
      message: String
    }
  }
</script>

2. 在父组件中使用组件并传递 props：

// ParentComponent.vue
<template>
  <MyComponent message="Hello World" />
</template>

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

  export default {
    components: {
      MyComponent
    }
  }
</script>

3. 在 `MyComponent.vue` 中使用 `setup` 函数来接收 props：

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

<script>
  export default {
    props: {
      message: String
    },
    setup(props) {
      console.log(props.message) // 输出 "Hello World"
    }
  }
</script>

在 `setup` 函数中，可以通过 `props` 参数来访问父组件传递的 props 值。在上面的例子中，`props.message` 的值为 "Hello World"。