如何让自定义组件在使用时有类型提示和类型约束?

作者站长头像
站长
· 阅读数 11
// CustomBlock.vue
<template>
  <div>{{ name }}</div>
</template>
<script lang="ts" setup>
defineProps<{
  name: string
}>()
</script>
<style scoped></style>
// index.vue
<CustomBlock :name="5"></CustomBlock>

在 index.vue 文件中如果把鼠标悬停在 CustomBlock 标签上,可以查看到该组件的类型,但是在书写属性时,并没有属性的提示,而且设置 :name="5" 并没有因为类型问题而标红线。目前开启了 typescript 和使用了 volar 插件,请问有什么方法可以触发提示,例如在书写属性时会提示组件所支持的属性,而且在属性类型不符合时标红,最好包括了对属性值的类型提示

回复
1个回答
avatar
test
2024-07-14

我这边看是没有问题的。建议检查一下是不是有什么插件和volar冲突了

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容