Vue 3 defineProps 定义对象数组类型详解

在 Vue 3 中，可以使用 'defineProps' 来定义对象数组类型。

首先，需要导入 'defineProps' 函数：

import { defineProps } from 'vue';

然后，在组件的 'props' 配置中使用 'defineProps' 来定义对象数组类型的 prop：

props: {
  myArray: {
    type: Array,
    default: () => []
  }
},

在上面的示例中，'myArray' 是一个对象数组类型的 prop，它的默认值是一个空数组。

当使用 'defineProps' 定义对象数组类型的 prop 时，Vue 3 会自动进行类型校验，确保传入的 prop 值是一个对象数组。

使用对象数组类型的 prop 时，可以通过遍历数组来访问每个对象的属性：

<template>
  <div>
    <div v-for='item in myArray' :key='item.id'>
      {{ item.name }}
    </div>
  </div>
</template>

在上面的示例中，'myArray' 是一个对象数组类型的 prop，通过 'v-for' 遍历数组并输出每个对象的 'name' 属性。

请注意，在 Vue 3 中，'defineProps' 是一个用于定义组件 props 的函数，它取代了 Vue 2 中的 'props' 选项。