vue中数组发生改变了，但是页面没有渲染，怎么办？

Quatre saisons

于 2021-05-10 11:50:51 发布

阅读量2.4k

点赞数 2

分类专栏：前端文章标签： javascript

本文链接：https://blog.csdn.net/ma_ly/article/details/116591601

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

vue中数组发生改变了，但是页面没有渲染，怎么办？

vue.js不能监听对象属性的添加和删除，因为在vue组件初始化的过程中，会调用getter和setter方法，所以该属性必须是存在在data中，视图层才会响应该数据的变化

<template>
  <div>
    <button @click="setAge">添加年龄</button>
    {{ form.name }}
    <input type="text" v-model="form.age">
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        name: '赵云',
      }
    }
  },
  methods: {
    setAge() {
    //this.$set(对象，对象钟的某一项key值，value值)
     this.$set(this.form, 'age', 15)
    }
  }
}
</script>