Vue 3.x 是一个重新设计的版本，它提供了更快的性能，更小的体积，更好的可扩展性和可维护性。它还包含了一些新特性，如 Composition API 和 Fragments，以及一些其他功能。
Vue 3.x 的核心是一个新的响应式系统，它使用 Proxy 和 Reflect API 来实现响应式数据。这意味着 Vue 现在可以监测对象属性的变化，而不需要使用 getter/setter 函数。这使得 Vue 更加高效，因为它不需要在每个对象上创建大量 getter/setter 函数来监测变化。
Vue 3.x 还包含了一个新的 Composition API，它允许开发人员将代码分割成多个函数来处理不同的逻辑。这使得代码更加易读、易于理解、易于测试、易于重用和易于扩展。
Vue 3.x 还包含 Fragments 特性，它允许开发人员在单个元素中渲染多个子元素。这使得开发人员能够在不影响 DOM 结构的情况下将多个子元素渲染到单个元素中。
此外，Vue 3.x 还包含一些其他功能，如 Portals、Teleport、Suspense 和 Async Components 等特性。Portals 允许开发人员将内容从当前 DOM 节点传递到新 DOM 节点中去; Teleport 使得开发人员能够将内容传递到不同位置; Suspense 使得开发人员能够在加载内容时显示“加载中”信息; Async Components 使得开发人员能够将代码分割成独立的部分并在需要时才加载部分代码。
// 例子: 使用 Composition API 来声明一个函数来返回当前时间:
import { ref } from 'vue' // 导入 ref 方法
export default function useCurrentTime() { // 声明 useCurrentTime()函数
const currentTime = ref(new Date()) // 使用 ref()方法声明 currentTime 变量
setInterval(() => { // 设定 setInterval()方法来保证 currentTime 的时间是最新的
currentTime.value = new Date() // 更新 currentTime 的时间
}, 1000)
return currentTime // 返回 currentTime 变量
}
本指南将概述可用于创建文档的不同设计元素。
VuePress 提供了一个自定义容器插件来创建警稿框。有四种类型：
Markdown 范例
::: info
You can find more information at this site.
:::
::: tip
This is a great tip to remember!
:::
::: warning
This is something to be cautious of.
:::
::: danger DANGER
This is something we do not recommend. Use at your own risk.
:::渲染 Markdown
INFO
你可以在这个网站上找到更多信息。
TIP
这是一个值得记住的好提示！
WARNING
这是需要谨慎的。
DANGER
这是我们不推荐的。使用风险自负。
VuePress 使用 Prism 提供语言语法高亮显示，方法是将语言附加到代码块的起始反撇号：
Markdown 示例
```js
export default {
name: "MyComponent"
}
```渲染输出
export default {
name: "MyComponent"
}向代码块添加行高亮显示，需要在大括号中附加行号。
Markdown 示例
```js{2}
export default {
name: "MyComponent",
props: {
type: String,
item: Object
}
}
```渲染 Markdown
export default {
name: "MyComponent",
props: {
type: String,
item: Object
}
}```js{4-5}
export default {
name: "MyComponent",
props: {
type: String,
item: Object
}
}
```export default {
name: "MyComponent",
props: {
type: String,
item: Object
}
}```js{2,4-5}
export default {
name: "MyComponent",
props: {
type: String,
item: Object
}
}
```export default {
name: "MyComponent",
props: {
type: String,
item: Object
}
}
#$data类型：Object详细：组件实例观察的数据对象。组件实例代理了对其 data 对象 property 的访问。参考选项 / 数据 - data#$pr...
#$watch参数：{string | Function} source{Function | Object} callback {Object} [options] {boolean} deep{boolean} immediate...
本节例子中代码使用的单文件组件语法#ref接受一个内部值并返回一个响应式且可变的 ref 对象。ref 对象具有指向内部值的单个 prop...
本节例子中代码使用的单文件组件语法#setup一个组件选项，在创建组件之前执行，一旦 props 被解析，并作为组合式 API 的入口点入...
#简介除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。注意，在 Vue2.0 中，代码复用和抽象的主要...