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>

它抛出ERROR [@vue/compiler-sfc] Unexpected reserved word 'interface'. (3:0) 。

我究竟做错了什么？

Answer 1

你只是忘记了一件事。您必须包含打字稿的属性！

<script setup lang="ts">

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