vue3 setup PropType

在 Vue 3 中，使用 Composition API 和 `<script setup>` 的方式来定义组件，而不是使用 `props` 和 `PropType`。下面是一个示例：

<template>
  <div>
    <p>Name: {{ name }}</p>
    <p>Age: {{ age }}</p>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';

// 定义 props 的类型
interface MyComponentProps {
  name: string;
  age: number;
}

// 使用 props 参数进行解构，并指定类型
const { name, age }: MyComponentProps = props;
</script>

在这个示例中，我们使用 `<script setup>` 的方式来定义组件。在 `setup` 块中，我们先导入需要的函数（例如 `ref`），然后定义 `props` 的类型为 `MyComponentProps`。接着，我们使用解构语法来从 `props` 中获取 `name` 和 `age`，并指定它们的类型为 `MyComponentProps`。

这种方式下，你无需再使用 `PropType` 来指定组件的 props 类型，而是通过 TypeScript 的类型注解来进行类型检查。这样可以获得更好的类型推断和开发体验。

需要注意的是，`<script setup>` 是 Vue 3.2 新增的特性，需要使用 Vue 3.2 或更高版本才能使用。另外，需要确保你的项目已经配置了 TypeScript。