Vue 基础
Nuxt 集成了 Vue 3,一个用于构建用户界面的渐进式框架。在本节中,我们将介绍 Vue 的基础知识。
在编辑器中看到的是一个 Vue 单文件组件(SFC)。
SFC 是一个可重用的自包含代码块,它封装了一起工作的 HTML、CSS 和 JavaScript,写在 .vue
文件内。它由一个 <script setup>
块定义 JavaScript 逻辑,一个 <template>
块定义 HTML 模板,以及可选的 <style>
块定义 CSS 样式。你可以使用右侧的操作环境进行尝试,或者在官方 Vue 文档中了解更多信息。
在 Nuxt 中,我们默认支持 Vue SFC,并且强烈建议你使用它来构建你的应用程序。Nuxt 中的 Vue SFC 与 Vue 默认的 SFC 有一点不同,在 Nuxt 中我们会自动导入 Vue 工具函数,因此你可以直接使用 ref
、computed
等 Vue API,而无需显式导入它们。
提示:你可能听说过定义 Vue 组件有几种不同的方式。总的来说,我们建议使用 <script setup>
和组合式 API 来获得最佳的开发体验。如果你是 Vue 新手,不必太担心理解所有不同的选择,你可以遵循我们的建议,因为我们相信这也是开始学习 Vue 最直观的方式。
接下来,我们将介绍以下主题: