博客

this.$set的使用场景： 给数组或对象中的属性改值

在项目开发的时候，有时候会遇到给data的一个对象添加一个属性或者赋值的时候，值赋过去了但是页面（视图）不更新。

<script>
export default {
 data() {
   return {
     lists: {
       name: '李四',
       value:0
     }
   }
 },
 methods: {
   setMessage() {
     this.$set(this.lists, 'value', 10)
     console.log(this.lists)
   }
 }
}
</script>

看代码，this.$set(obj, key, value)当调用setMessage函数时候需要给value赋值为10，第一个obj：是当前的对象，第二个key：是需要修改的属性，第三个value：是需要重新赋的值。

例如下：

当使用分页的时候，默认给分页赋值为第一页，那么此时就是 this.query 里的 pageIndex 赋值为 1

以上代码希望帮助到您