♥ vue中$set用法详细讲解
在Vue.js中，$set是一个用于向响应式对象中添加一个属性，并确保这个属性同样是响应式的，能够触发视图更新的方法。
使用$set的常见场景是向响应式对象的数组中添加一个元素，因为直接使用索引设置数组元素可能不会触发视图更新。
下面是$set的基本用法：
// 假设有一个Vue实例
new Vue({
data: {
items: []
},
methods: {
addItem(item) {
// 使用$set添加新元素到items数组，并确保它是响应式的
this.$set(this.items, this.items.length, item);
}
}
});$set方法接受三个参数：
- target：要修改的响应式对象。
- key：要添加/修改的属性名。
- value：新属性的值。
如果key在target对象中不存在，$set将会自动添加这个属性并确保它是响应式的。如果key已经存在，它的值将会被更新为value。
注意：$set只能用于Vue实例的data对象上，如果尝试对非响应式对象使用$set，将不会有任何效果。
评论已关闭