vue中this.$set()用法

在 Vue.js 中,this.$set() 方法用于在响应式对象上设置属性并确保这个新属性也是响应式的。通常情况下,Vue.js 可以响应地监测到对象属性的变化,但是在以下情况下需要使用 this.$set()

  1. 新增对象属性:
    当你向一个已经创建的对象添加新属性时,新添加的属性不会触发视图更新。
    例如:
this.obj.newProp = 'value'; // 不会触发视图更新

此时,你可以使用 this.$set()

this.$set(this.obj, 'newProp', 'value');

这样 Vue.js 就能监听到 newProp 的变化并进行响应式更新。
2. 数组变动的特殊情况:
Vue.js 可以监听到数组的变动,但是在以下特定情况下需要使用 this.$set() 来确保变动被监听到:
直接通过索引设置项时:

this.arr[0] = 'new value'; // 不会触发视图更新

使用 this.$set()

this.$set(this.arr, 0, 'new value');

总结来说,this.$set(obj, key, value) 方法可以在 Vue.js 中动态添加响应式属性,确保对象和数组的变动能够正确触发视图更新。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值