vue3 props 使用

Vue 3 中的 props 使用与 Vue 2 有一些不同。在 Vue 3 中，props 的声明变得更加简单，并且支持 TypeScript 类型推断。下面是一个简单的示例来说明 Vue 3 中如何使用 props：

首先，在组件的选项对象中声明 props：

export default {
  props: {
    message: String,
    count: {
      type: Number,
      default: 0
    }
  },
  // ...
}

上述代码中，我们声明了两个 props：`message` 和 `count`。`message` 的类型为字符串，`count` 的类型为数字，并且有一个默认值为 0。

接下来，在组件模板中可以直接使用这些 props：

<template>
  <div>
    <p>{{ message }}</p>
    <p>{{ count }}</p>
  </div>
</template>

在上述代码中，我们通过 `{{ message }}` 和 `{{ count }}` 的方式直接在模板中使用了 props。

最后，使用组件时，可以通过传递属性的方式向组件传递数据：

<template>
  <my-component message="Hello Vue 3!" :count="42" />
</template>

在上述代码中，我们通过 `message="Hello Vue 3!"` 和 `:count="42"` 的方式向组件传递了数据。

这就是在 Vue 3 中使用 props 的基本方法。通过这种方式，我们可以轻松地在组件之间传递数据，并且可以利用 TypeScript 提供的类型检查功能来确保代码的正确性。