vue 3 set方法
时间: 2023-12-12 08:35:14 浏览: 67
vue3源码解析
5星 · 资源好评率100%
很抱歉,引用[1]中的信息是错误的。在Vue 3中,确实不再需要使用`$set`方法来实现响应式了,但是也不应该直接使用对象属性赋值的方式来添加新属性。相反,Vue 3提供了一个新的`reactive`函数来创建响应式对象,以及一个新的`ref`函数来创建响应式基本类型变量。如果要添加新属性,可以使用`reactive`函数创建一个新对象,然后将原始对象的属性复制到新对象中,并添加新属性。以下是一个示例:
```javascript
import { reactive } from 'vue'
const originalObj = { name: 'Wj' }
const newObj = reactive({ ...originalObj, age: 22 })
console.log(newObj.name) // 输出:Wj
console.log(newObj.age) // 输出:22
```
如果要更新现有属性的值,可以直接使用对象属性赋值的方式,Vue 3会自动将其设置为响应式。以下是一个示例:
```javascript
import { reactive } from 'vue'
const obj = reactive({ name: 'Wj' })
obj.name = 'Tom'
console.log(obj.name) // 输出:Tom
```
阅读全文