请问,Vue3.2 script setup语法,子组件接收对象数组,怎么验证?试了很多种写法都不行。
以下是子组件的代码:
<script setup lang="ts">
import {
reactive,
toRefs,
PropType
} from 'vue';
interface Book {
/** 标题 **/
title: string,
/** 副标题 **/
subTitle: string
}
// 方式1:不报错,但是不能进行类型限制
const props = defineProps<{
list: Book[]
}>();
// 方式2:报错
const props = defineProps<{
// 方式2.1:报错
list: Array as PropType<Book[]>
// 方式2.2:报错
list: Array as PropType<Book>
// 方式2.3:报错
list: Array as Array<Book[]>
}>();
// 方式3:不报错,但是不能进行类型限制
const props = defineProps({
list: {
// 方式3.1:不报错,但是不能进行类型限制
type: Array as () => PropType<Book[]>,
// 方式3.1:不报错,但是不能进行类型限制
type: Array as () => Array<Book[]>,
required: true,
default: () => []
}
});
</script>
我想要达到的结果
请问,怎么才能在子组件中验证传入的对象数组呢?