vue setter

Vue中的setter是computed属性中的一个方法，它负责设置值。在setter的函数体中，我们可以对属性进行修改或者其他操作。当我们调用setter方法时，对应的属性值也会被更新。需要注意的是，在setter函数体中，一切的return都是无效的。除了computed属性中的setter方法，Vue还有其他的属性访问器，也称为存取器属性，它是一组获取和设置值的函数。

相关问题

vue Computed setter

在 Vue 中，计算属性（Computed）是一种可以根据现有数据计算出其他数据的属性。计算属性是基于它所依赖的数据进行缓存的，只有当计算属性依赖的数据发生改变时，才会重新计算。

如果你需要给计算属性赋值，那么你需要在计算属性中定义setter方法。setter方法接受一个参数，这个参数是你要设置的新值，你可以在setter方法中处理这个新值，或者把这个新值传给其他的组件数据。

下面是一个计算属性（带setter方法）的例子：

<template>
  <div>
    <p>{{ fullName }}</p>
    <input v-model="firstName">
    <input v-model="lastName">
  </div>
</template>

<script>
export default {
  data() {
    return {
      firstName: 'John',
      lastName: 'Doe'
    }
  },
  computed: {
    fullName: {
      get() {
        return this.firstName + ' ' + this.lastName
      },
      set(newValue) {
        const names = newValue.split(' ')
        this.firstName = names[0]
        this.lastName = names[1]
      }
    }
  }
}
</script>

在上面的例子中，我们定义了一个fullName计算属性，它由firstName和lastName两个数据计算得来。我们同时定义了setter方法，当我们在input框中输入新的fullName时，setter方法会被调用，把新的fullName解析成firstName和lastName，然后更新这两个数据。

需要注意的是，如果你要使用计算属性的setter方法，那么你必须同时定义getter方法，否则Vue会抛出错误提示。

vue 监测数据 setter

Vue通过封装observer方法来实现对数据的监控，其中包括对对象和数组的监测。对于对象，Vue会遍历对象中的每一个属性，并对属性添加getter和setter，从而实现对数据的监控。当属性被读取或修改时，Vue会通过getter和setter来进行相应的操作。对于数组，Vue会通过重写数组的原型方法来实现对数组的监测。具体来说，Vue会重写数组的push、pop、shift、unshift、splice、sort和reverse方法，当这些方法被调用时，Vue会发出通知，从而实现对数组的监测。

在Vue中，setter是用来监测数据变化的重要机制。当数据发生变化时，setter会被触发，从而通知Vue进行相应的更新操作。setter的实现方式是通过Object.defineProperty方法来实现的，该方法可以定义一个对象的属性，并为该属性添加getter和setter。当属性被读取或修改时，getter和setter会被相应地调用。setter的作用是在数据发生变化时，通知Vue进行相应的更新操作，从而保证视图和数据的同步。