《Vue3实战教程》48：Vue3渲染函数 & JSX
如果您有疑问，请观看视频教程《Vue3实战教程》计算属性基础示例模板中的表达式虽然方便，但也只能用来做简单的操作。如果在模板中写太多逻辑，会让模板变得臃肿，难以维护。比如说，我们有这样一个包含嵌套数组的对象：jsconst author = reactive({
name: 'John Doe',
books: [
'Vue 2 - Advanced Guide',
'Vu
如果您有疑问，请观看视频教程《Vue3实战教程》列表渲染v-for我们可以使用 v-for 指令基于一个数组来渲染一个列表。v-for 指令的值需要使用 item in items 形式的特殊语法，其中 items 是源数据的数组，而 item 是迭代项的别名：jsconst items = re
如果您有疑问，请观看视频教程《Vue3实战教程》插件介绍插件 (Plugins) 是一种能为 Vue 添加全局功能的工具代码。下面是如何安装一个插件的示例：jsimport { createApp } from 'vue'
const app = createApp({})
app.use(myPlugin, {
/* 可选的选项 */
})一个插件可以是一个拥有 i
如果您有疑问，请观看视频教程《Vue3实战教程》测试为什么需要测试自动化测试能够预防无意引入的 bug，并鼓励开发者将应用分解为可测试、可维护的函数、模块、类和组件。这能够帮助你和你的团队更快速、自信地构建复杂的 Vue 应用。与任何应用一样，新的 Vue 应用可能会以多种方式崩溃，因此，在发布前发现并解决这些问题就变得十分重要。在本篇指引中，我们将介绍一些基本术语，并就你的 Vue
如果您有疑问，请观看视频教程《Vue3实战教程》安全报告漏洞当一个漏洞被上报时，它会立刻成为我们最关心的问题，会有全职的贡献者暂时搁置其他所有任务来解决这个问题。如需报告漏洞，请发送电子邮件至 security@vuejs.org。虽然很少发现新的漏洞，但我们仍建议始终使用最新版本的 Vue 及其官方配套库，以确保你的应用尽可能地安全。首要规则：不要使用无法信赖的模板使用 V
如果您有疑问，请观看视频教程《Vue3实战教程》简介你正在阅读的是 Vue 3 的文档！Vue 2 已于 2023 年 12 月 31 日停止维护。详见 Vue 2 终止支持 (EOL)。想从 Vue 2 升级？请参考迁移指南。在 VueMastery 上观看视频课程学习 Vue什么是 Vue？Vue (发音为 /vjuː/，类似 view) 是一
如果您有疑问，请观看视频教程《Vue3实战教程》服务端渲染 (SSR)总览什么是 SSR？Vue.js 是一个用于构建客户端应用的框架。默认情况下，Vue 组件的职责是在浏览器中生成和操作 DOM。然而，Vue 也支持将组件在服务端直接渲染成 HTML 字符串，作为服务端响应返回给浏览器，最后在浏览器端将静态的 HTML“激活”(hydrate) 为能够交互的客户端应用。一个由服务端渲染的 Vue
如果您有疑问，请观看视频教程《Vue3实战教程》事件处理监听事件我们可以使用 v-on 指令 (简写为 @) 来监听 DOM 事件，并在事件触发时执行对应的 JavaScript。用法：v-on:click="handler" 或 @click="handler"。事件处理器 (handler) 的值可以是：内联事件处理器：事件被触发时执行的内联
如果您有疑问，请观看视频教程《Vue3实战教程》工具链在线尝试你不需要在机器上安装任何东西，也可以尝试基于单文件组件的 Vue 开发体验。我们提供了一个在线的演练场，可以在浏览器中访问：Vue 单文件组件演练场自动随着 Vue 仓库最新的提交更新支持检查编译输出的结果StackBlitz 中的 Vue + Vite类似 IDE 的环境，但实际是在浏览器中运行 Vite 开发服务器和本地
如果您有疑问，请观看视频教程《Vue3实战教程》状态管理什么是状态管理？理论上来说，每一个 Vue 组件实例都已经在“管理”它自己的响应式状态了。我们以一个简单的计数器组件为例：vue<script setup>
import { ref } from 'vue'
// 状态
const count = ref(0)
// 动作
function increment()
如果您有疑问，请观看视频教程《Vue3实战教程》快速上手线上尝试 Vue想要快速体验 Vue，你可以直接试试我们的演练场。如果你更喜欢不用任何构建的原始 HTML，可以使用 JSFiddle 入门。如果你已经比较熟悉 Node.js 和构建工具等概念，还可以直接在浏览器中打开 StackBlitz 来尝试完整的构建设置。创建一个 Vue 应用前提
如果您有疑问，请观看视频教程《Vue3实战教程》模板语法Vue 使用一种基于 HTML 的模板语法，使我们能够声明式地将其组件实例的数据绑定到呈现的 DOM 上。所有的 Vue 模板都是语法层面合法的 HTML，可以被符合规范的浏览器和 HTML 解析器解析。在底层机制中，Vue 会将模板编译成高度优化的 JavaScript 代码。结合响应式系统，当应用状态变更时，Vue 能够智能地
《Vue3实战教程》51：Vue3插槽 Slots
如果您有疑问，请观看视频教程《Vue3实战教程》计算属性基础示例模板中的表达式虽然方便，但也只能用来做简单的操作。如果在模板中写太多逻辑，会让模板变得臃肿，难以维护。比如说，我们有这样一个包含嵌套数组的对象：jsconst author = reactive({
name: 'John Doe',
books: [
'Vue 2 - Advanced Guide',
'Vu
如果您有疑问，请观看视频教程《Vue3实战教程》模板引用虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作，但在某些情况下，我们仍然需要直接访问底层 DOM 元素。要实现这一点，我们可以使用特殊的 ref attribute：template<input ref="input">ref 是一个特殊的 attribute，和&n
如果您有疑问，请观看视频教程《Vue3实战教程》依赖注入此章节假设你已经看过了组件基础。若你还不了解组件是什么，请先阅读该章节。Prop 逐级透传问题通常情况下，当我们需要从父组件向子组件传递数据时，会使用 props。想象一下这样的结构：有一些多层级嵌套的组件，形成了一棵巨大的组件树，而某个深层的子组件需要一个较远的祖先组件中的部分数据。在这种情况下，如果仅使用 props 则必须将其
如果您有疑问，请观看视频教程《Vue3实战教程》性能优化概述Vue 在大多数常见场景下性能都是很优秀的，通常不需要手动优化。然而，总会有一些具有挑战性的场景需要进行针对性的微调。在本节中，我们将讨论用 Vue 开发的应用在性能方面该注意些什么。首先，让我们区分一下 web 应用性能的两个主要方面：页面加载性能：首次访问时，应用展示出内容与达到可交互状态的速度。这通常会用 Google
如果您有疑问，请观看视频教程《Vue3实战教程》搭配 TypeScript 使用 Vue像 TypeScript 这样的类型系统可以在编译时通过静态分析检测出很多常见错误。这减少了生产环境中的运行时错误，也让我们在重构大型项目的时候更有信心。通过 IDE 中基于类型的自动补全，TypeScript 还改善了开发体验和效率。Vue 本身就是用 TypeScript 编写的，并对 TypeScript
