节选于教程: Vue3 入门指南与实战案例
1.响应式API
1.1 ref
Ref 对象的值的读取，切记！必须通过 .value
例子:
// 读取一个字符串 const msg: string = 'Hello World!' console.log(msg) // 读取一个数组 const uids: number[] = [1, 2, 3] console.log(uids[1])
1.2 reactive 是继 ref 之后最常用的一个响应式 API 了，相对于 ref ，它的局限性在于只适合对象、数组。
不要对 Reactive 数据进行 ES6 的解构 操作，因为解构后得到的变量会失去响应性。
Reactive 数组,不推荐用传统的uids = [] 重置,会失去响应性,要通过重置数组的 length 长度来实现数据的重置：
const uids: number[] = reactive([1, 2, 3]) /** * 推荐使用这种方式，不会破坏响应性 */ uids.length = 0 // 异步获取数据后，模板可以正确的展示 setTimeout(() => { uids.push(1) }, 1000)