Vue3-TS中的接口-泛型-自定义类型

发布时间：2024年01月15日

1首先一般在src下新建types文件夹，用来存放接口类型

ccd897d3a08c420395b3ac9de197d5e5.png

2定义一个接口，用于限制person对象的具体属性

当需要用这个类型形成数组时，有2种写法

export type Persons = Array<PersonInter>

export type Persons = PersonInter[]

b1f5e3fb360542a8b9edb3df66e097a3.png

3在文件中使用接口，需要先引入

首先需要加上 type 前缀

其次引入了必须使用！

然后在定义的变量后用：type的形式，申明接口

0f04bb12843140da901c7c636e651724.png

4如何结合reactive和泛型

有2种写法

第一种

82f044f4e7634510a6a56f8dc091124f.png

第二种

dab8d438b92c4267aa180191171d6ed8.png

5defineProps和泛型结合使用

<Person a="哈哈” :list="personList"/>? //父亲传给儿子list数据

defineProps<{list:Persons}>()? ?//儿子接受数据的时候，用泛型加以限制，表示我接受的名为list的数据只接受Persons类型

a8fec16a59ee4bd49c887f1202c3cc02.png

b815d87a5224484b856249d38963e75f.png

?

文章来源:https://blog.csdn.net/qq_42371932/article/details/135495658
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
最新文章