在vue3+ts的项目中, 遇到ts报错,代码如下:

import { reactive, toRefs, onBeforeMount, onMounted, ExtractPropTypes } from 'vue'

interface Item {
    width?: string | number;
    label?: string;
    prop?: string;
}
type columnsType = Array<Item>;
const props = defineProps({
    data: {
        type: Array,
        default: []
    },
    columns: {
        type: Array,
        default: []
    }
})
const data = props.data as any;
const columns = props.columns as unknown as columnsType;

报错如图:
在这里插入图片描述
安装的插件为Volar,其实这里错误提示的翻译有误,英文本意为导出的东西使用了 Item,但这个接口没导出。
将Item那个interface导出即可:

 export interface Item {
    width?: string | number;
    label?: string;
    prop?: string;
}

另一种方式为,不使用interface,直接使用type也不会报错,代码如下:

type Item = {
    width?: string | number;
    label?: string;
    prop?: string;
}

2022/11/14 更新

最新排查出现此问题的原因,使用了slot,并添加了参数传递。

Logo

前往低代码交流专区

更多推荐