vue 数据更新，视图未更新，原因，解决方法

复现问题：

<template>
    <div> 
        <p>{
  {classInfo.number}}<p>
        <p>{
  {classInfo.address}}<p>
    </div>
</template>
export default {
    
    data() {
        return {
            classInfo:{}
          }
    }
    
    created() {
        setTimeOut(()=>{
            this.classInfo.number = 100,
            this.classInfo.address = 'china',
        },1000)
    }
}

此时发现页面并没有获取到更新后的值，原因是：

classInfo,中属性，并没有被劫持，所以classInfo的数据不是响应式的。

数据被劫持一般有两种，第一，data初始化时data中的属性，虽然data中有classInfo属性，但是classInfo中并没有任何属性，所以classInfo的属性，没有在data中劫持，但是classInfo本身被劫持了

第二，是计算属性，很明显这不是计算属性

第三，使用set设置了这个属性，代码中没有设置。

 

因此根据上面的原因分析：有三种解决方案。

1.初始化的时候设置classInfo属性，使得初始化的时候