vue中this.$set的使用

this.$set(obj, key, value)

用途：为data中的某一个对象添加一个属性

<template>
  <div>
    <Button @click="setMessage" type="primary">添加属性</Button>
    {{ student.name }}
    <input type="text" v-model="student.age">
  </div>
</template>
<script>
export default {
  data() {
    return { 
      student:{
        name: "张三"
      }
     };
  },
  mounted() {},
  methods: {
    setMessage() {
      this.student.age = 15;
      console.log(this.student);
    }
  }
};
</script>

点击添加属性按钮的时候，给studen添加一个age属性，发现控制台打印出了这个属性，但是视图上并没有更新。

解决办法：

1. 使用this.$set(obj, key, value)/vue.set(obj, key, value)

	this.$set(this.student, 'age',  15)

2. 通过Object.assign(target, sources)方法

 this.student = Object.assign({}, this.student)

参考链接: https://blog.csdn.net/hhkongbai/article/details/101022019.