vue中$set是做什么的

$set是Vue.js中的一个方法，用于向响应式对象添加一个新的属性，或修改已有属性，并触发响应式更新。

在Vue.js中，当我们使用data属性来定义响应式对象时，Vue会将其转化为getter和setter，并在属性被访问或修改时进行响应式更新。然而，一旦一个对象被创建，Vue将无法检测到新添加的属性或已有属性的修改，这就导致了在向响应式对象中添加新属性或修改属性时无法触发视图的更新。

而$set方法可以解决这个问题。它的语法形式为this.$set(object, key, value)，其中object是目标对象，key是新添加或修改的属性名，value是新属性的值。$set方法会将key和value添加到对象中，并通过触发响应式更新来确保视图的更新。

需要注意的是，只有在目标对象是响应式的且属性不存在时，$set方法才能触发响应式更新。如果目标对象是一个普通的JavaScript对象，$set方法只会改变对象本身，而不会触发响应式更新。

总结起来，$set方法是为了解决Vue中对象响应式更新的一个工具方法，用于向响应式对象添加新属性或修改已有属性，保证视图的更新。

在Vue中，$set是一个实例方法，用于在一个响应式对象上设置一个新属性，并确保这个新属性是响应式的。

Vue使用响应式系统来跟踪数据的变化，以便在数据发生变化时，能够自动更新相关的视图。然而，当你在一个已经创建的对象上添加一个新的属性时，Vue是无法检测到这个变化的。这是因为Vue只会在初始化时对对象的属性进行响应式处理，对于后续新增的属性不会进行响应式处理。

这种情况下，就可以使用$set方法来解决。$set方法接受三个参数：目标对象、要添加的属性名和属性值。它能够将一个新的响应式属性添加到一个已经创建的对象上，以便当属性发生变化时能够触发视图的更新。

以下是$set方法的一些注意事项：

1. 只有对象才能被$set添加新属性，不能将属性添加到数组或基本数据类型上。

2. $set方法是全局的，可以在任何组件中使用。

3. 添加的新属性必须是可响应的，即不能是Vue实例属性或者已经被Vue转换成响应式的属性。

4. 如果目标对象是响应式的数组，确保以正确的方式修改数组，比如使用splice方法添加新元素，而不是直接改变数组索引值。

5. $set还可以用于数组的索引上，以改变数组中指定位置的元素。

在Vue.js中，$set是Vue的实例方法之一，用于在响应式对象上设置一个新的属性，并使其变为响应式。

Vue.js的响应式系统能够追踪对象属性的变化，并能够在对象属性发生改变时更新对应的视图。然而，当我们往一个已经创建的对象上添加一个新的属性时，这个新属性并不会触发视图的更新。这是因为Vue无法在对象被创建之后动态追踪属性的变化。

为了解决这个问题，Vue提供了$set方法。$set方法的作用是在对象上设置一个新属性，并且使之成为响应式的。这样，当新属性发生改变时，Vue能够检测到，并更新相应的视图。

$set方法的用法如下：

Vue.$set(obj, key, value)

• obj：要添加属性的对象。
• key：要添加的属性的键。
• value：要添加的属性的值。

可以通过以下步骤使用$set方法：

1. 在Vue的实例中引入$set方法：

import Vue from 'vue'

2. 在需要添加属性的地方调用$set方法：

Vue.$set(obj, key, value)

下面是一个$set方法的示例：

<template>
  <div>
    <p>{{ obj.message }}</p>
    <button @click="addProperty">Add Property</button>
  </div>
</template>

<script>
import Vue from 'vue'

export default {
  data() {
    return {
      obj: {
        message: 'Hello Vue.js'
      }
    }
  },
  methods: {
    addProperty() {
      Vue.$set(this.obj, 'newProperty', 'New Property Value')
    }
  }
}
</script>

在上面的示例中，当点击按钮时，会调用addProperty方法，在这个方法中使用$set方法，在obj对象上添加一个新属性newProperty。然后，由于新属性是通过$set方法添加的，它会成为响应式的。这意味着当新属性发生改变时，对应的视图会自动更新。