问题： 刚学习vue的人可能会遇到这样一种情况，那就是当我们把属性在data中定义，接口异步请求到数据，并且把值赋值到我们在data中定义的值上，但是dom却没有更新，这时候我们可能就在想，为什么了？是不是vue有问题啊，妈的，vue有毛病吧。

<div id="app">
        <h2>{{data.value}}</h2>
</div>

 data: {
     data: {}
 },
 created() {
    this.$axios.get().then(res => {
        this.data.value = res;
    })
}

哈哈！如果这么想你就错了，vue已经很明确的告诉我们，只有在data中定义的值才能去更新，你value没有定义怎么去更新。这么做也是为了尽量减少dom的渲染，最大化的节约性能。
解决方法
1、在请求接口得到数据后，把data值再度赋值为空。

<div id="app">
        <h2>{{data.value}}</h2>
</div>

 data: {
     data: {}
 },
 created() {
    this.$axios.get().then(res => {
        this.data = {};
        this.data.value = res;
    })
}

原理：因为vue的dom更新是异步的，即当setter操作发生后，指令并不会立马更新，指令的更新操作会有一个延迟，当指令更新真正执行的时候，此时.value属性已经赋值，所以指令更新模板时得到的是新值。
2、Vue.$set
通过set方法可以将添加一个具备响应式特性的属性，并且其子属性也具备响应式特性，但是必须是新属性才可以，如果是本身已有的属性该方法是不起作用的。

<div id="app">
        <h2>{{data.value}}</h2>
</div>

 data: {
     data: {}
 },
 created() {
    this.$axios.get().then(res => {
        this.$set('data.value', res);
    })
}