【ts】defineProps数组的类型声明

第一种:使用Record<string, unknown>

Record<string, unknown>表示一个对象,键是string类型,值是未知的

typescript 复制代码
import { defineProps, PropType } from 'vue';

const props = defineProps({
  dataList: {
    type: Array as PropType<Record<string, unknown>[]>,
    default: () => [],
  }
})

第二种:使用索引签名

索引签名表示任何键都是字符串,值可以是任何类型

typescript 复制代码
import { defineProps, PropType } from 'vue';

interface obj {
	[key: string]: unknown
}
const props = defineProps({
  dataList: {
    type: Array as PropType<obj[]>,
    default: () => [],
  }
})

PropType

PropType 是 Vue 提供的工具类型,用于定义复杂的 prop 类型

要使用,先安装

typescript 复制代码
npm install vue @vue/runtime-core

然后在页面中import

typescript 复制代码
import { PropType  } from 'vue';
相关推荐
禅思院13 小时前
在win10上配置 Rust以及修改默认位置问题
开发语言·前端·后端·rust·cargo·mingw64·cargo安装位置
2503_9284115613 小时前
12.17 vue递归组件
前端·javascript·vue.js
暴富的Tdy13 小时前
【使用 Vue2 脚手架创建项目并实现主题切换功能涵盖Ant-Design-Vue2/Element-UI】
vue.js·elementui·anti-design-vue·vue切换主题
LYFlied13 小时前
【每日算法】LeetCode 79. 单词搜索
前端·算法·leetcode·面试·职场和发展
如果你好13 小时前
🔥 手撕call/apply/bind:从ES6用法到手写实现,吃透this指向核心
前端·javascript
大佬桑13 小时前
Talend API Tester 接口测试插件 Google Chrome 浏览器的轻量级 API 测试插件
前端·chrome
阿西谈科技13 小时前
利用 AI 写前端:从辅助编码到智能化开发的完整实践指南
前端
爱喝麻油的小哆13 小时前
前端html导出pdf,(不完美)解决文字被切割的BUG,记录一下
前端
@大迁世界13 小时前
React 以惨痛的方式重新吸取了 25 年前 RCE 的一个教训
前端·javascript·react.js·前端框架·ecmascript
小蹦跶儿13 小时前
Vue项目中字体引入:完整实操指南
vue.js·字体·视觉设计