$set()的使用方法

$set解释：

$set 是 Vue.js 中的一个全局API，主要用于动态向响应式对象中添加新属性或者修改已有属性，并确保新属性也是响应式的。

如何使用 $set：

this.$set 方法接受三个参数：

1. 目标对象target：需要添加属性的对象。
2. 键名name/index：你要添加的属性名称或数字的索引。
3. 值value：该属性的值或者数组索引的值。

示例代码

假设有一个 Vue 实例的数据对象，你想为其动态添加一个新属性：

new Vue({
  el: '#app',
  data: {
    userProfile: {
      name: 'Alice'
    }
  },
  mounted() {
    // 正确的添加响应式属性
    this.$set(this.userProfile, 'age', 25);
  }
});

在这个例子中，this.$set 被用来给 userProfile 对象添加一个新的响应式属性 age。现在，如果 age 的值在未来被更改，界面将会自动更新。

注意事项

• $set 仅在必须向响应式对象添加新属性时使用。如果你在创建对象时就知道所有的属性，最好是在开始时就声明所有的属性。
• 如果你需要删除对象的属性并确保也是响应式的，可以使用 this.$delete。