单v纯微笑 2022-07-04 09:53 采纳率: 33.3%
浏览 91
已结题

请问,Vue3.2 script setup语法,子组件接收对象数组,怎么验证?试了很多种写法都不行。

请问,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>
我想要达到的结果

请问,怎么才能在子组件中验证传入的对象数组呢?

  • 写回答

0条回答 默认 最新

    报告相同问题?

    问题事件

    • 系统已结题 7月12日
    • 修改了问题 7月4日
    • 创建了问题 7月4日

    悬赏问题

    • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
    • ¥500 把面具戴到人脸上,请大家贡献智慧
    • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面,不要作在线的,要离线状态。
    • ¥15 各位 帮我看看如何写代码,打出来的图形要和如下图呈现的一样,急
    • ¥30 c#打开word开启修订并实时显示批注
    • ¥15 如何解决ldsc的这条报错/index error
    • ¥15 VS2022+WDK驱动开发环境
    • ¥30 关于#java#的问题,请各位专家解答!
    • ¥30 vue+element根据数据循环生成多个table,如何实现最后一列 平均分合并
    • ¥20 pcf8563时钟芯片不启振