更新时间:2024-02-28 来源:黑马程序员 浏览量:

在Vue中,当我们使用vm.$set()方法时,我们可以解决对象新增属性不能响应的问题。这种情况通常出现在我们想要动态地向Vue实例的数据对象添加新的属性时。
下面是使用vm.$set()方法的示例:
// 创建一个 Vue 实例
var vm = new Vue({
data: {
userProfile: {
name: 'John Doe',
age: 30
}
}
})
// 此时 'userProfile' 对象的 'name' 和 'age' 属性是响应式的
// 但如果我们尝试添加一个新属性,比如 'email'
vm.userProfile.email = 'john@example.com'
// 上面这样添加属性,Vue 不会自动进行响应式更新
// 为了解决这个问题,可以使用 vm.$set()
vm.$set(vm.userProfile, 'email', 'john@example.com')
// 现在 'email' 属性已经是响应式的了使用vm.$set(object, key, value)方法可以告诉Vue库在一个已经创建的对象上添加一个新属性,并确保这个新属性是响应式的。
1024首播|39岁程序员逆袭记:不被年龄定义,AI浪潮里再迎春天
2025-10-241024程序员节丨10年同行,致敬用代码改变世界的你
2025-10-24【AI设计】北京143期毕业仅36天,全员拿下高薪offer!黑马AI设计连续6期100%高薪就业
2025-09-19【跨境电商运营】深圳跨境电商运营毕业22个工作日,就业率91%+,最高薪资达13500元
2025-09-19【AI运维】郑州运维1期就业班,毕业14个工作日,班级93%同学已拿到Offer, 一线均薪资 1W+
2025-09-19【AI鸿蒙开发】上海校区AI鸿蒙开发4期5期,距离毕业21天,就业率91%,平均薪资14046元
2025-09-19