VUE的响应模式是基于get() 和 set() 订阅观察的模式实现,在data实例生成后,没有在data实例中初始化的property 是无法被订阅到的,无法实现响应
所以会有 vm.$set() 的内置方法,将新的property响应的绑定到data实例上,基本用法如下:
vm.$set(object, key, value)
$set 第一个参数接收一个对象,这个对象一定是在 vue 监控下的,但是注意不能是data实例本身
$set 第二个参数接收一个字符串,字符串是这个新增property的键名
$set 第三个参数接收Any数据,这个数据是这个新增property的键值
官方解释如下:https://cn.vuejs.org/v2/api/#Vue-set
代码实例:
1 <script> 2 import getSomething from '@/api/example 3 4 export default { 5 data () { 6 return { 7 example:{} 8 } 9 } 10 11 mounted () { 12 getSomething().then(res => { // 请求获取的数据 13 this.$set(this.example, 'keyName', res.data) // 使用$set绑定到data中去 14 }) 15 } 16 } 17 </script>
这里虽然基本用法知道了,但是有一个疑问,既然知道这里会接收新的数据,为什么不事先就在property里初始化呢?还要手动$set添加?