vue $set

• 主要解决页面渲染完成后,后续给对象添加属性在页面显示不出问题.

<template>
<div>
  <div v-for="(item,index) in list" :key="index">{{item}}</div>
  <button @click="abc">naniu </button>
</div>
</template>

<script>
export default {
  data() {
    return {
      list: [0]
    }
  },
  methods: {
    abc() {
      this.$set(this.list, 1, '123')
      // this.list[1] = '123'  // 按钮点击之后数据并不会显示在页面上
    }
  }
}
</script>