VUE $set的用法

从vue1.0中继承的vm.$set( object, key, value )用于动态监控数据元素，在实例创建后添加数组属性并且有响应可用该方法实现。

<template>
  <div>
    <input v-model="opt" @blur="add()"/>
    <ul>
      <li v-for="item in arr">
        {{ item }}
      </li>
    </ul>
  </div>
</template>
 
<script>
export default {
  data () {
    return {
      arr: [ '北京', '上海', '广东', '深圳' ],
      opt: ''
    }
  },
  methods: {
    add () {
      this.$set(this.arr, this.arr.length, this.opt)
    }
  }
}
</script>