如何使用 Vue 将我的 props 定义为与打字稿中的“img”元素相同？

Question

我想对一个组件进行类型推断，该组件传递

img

元素的所有属性。

我试过这个：

defineProps<ImgHTMLAttributes>()
// and
defineProps<HTMLImageElement>()

两者都返回错误：

[plugin:vite:vue] [@vue/compiler-sfc] 无法解析的类型引用或不支持的内置实用程序类型

这是我的组件：

<script setup lang="ts">
import type { ImgHTMLAttributes }  from 'vue'

defineProps<ImgHTMLAttributes>()
// or defineProps<HTMLImageElement>()


</script>

<template>
  <div>
    // Some other elements here
    <img
      v-bind="$attrs"
    />
  </div>
</template>

Answer 1

我不确定这就是你所要求的，但这就是你所说的你希望在自定义组件中收到道具的方式：

interface Props {
  xxxxxx?: number;
}

const props = withDefaults(defineProps<Props>(), {
  xxxxxx: undefined,
});