typescript - nuxt3 自定义类型的简单指南

Question

我有一个 vue 文件，我想在其中使用自定义类型:

/* 
file: /components/Grid.vue 
*/

<script setup>
// define Section type
interface Section {
  type: string;
  img: string;
  heading: string;
  content: string;
}

const props = defineProps < {
  sections: Section[],
  baseUrl: string
} > ();
const sections = ref(props.sections);
const baseUrl = ref(props.baseUrl);
</script>

它抛出 错误 [@vue/compiler-sfc] 意外的保留字“接口(interface)”。 (3:0) 尽管启用了 typescript 。

我做错了什么？

Answer 1

你只忘记了一件事。您必须为 typescript 包含一个属性!

<script setup lang="ts">

lang="ts" 属性让 Vue 知道您正在使用 TypeScript。这是文档的链接: https://vuejs.org/guide/typescript/overview.html#usage-in-single-file-components