Vue 知识点：Vue.set()方法

Vue 知识点：Vue.set()方法

<div id="root">
     <h1>学校信息</h1>
     <h2>学校名称：{{name}}</h2>
     <h2>学校地址：{{address}}</h2>
     <hr/>
     <h1>学生信息</h1>
     <button @click="addSex">添加一个性别属性，默认是男</button>
     <h2>姓名：{{student.name}}</h2>
     <h2 v-if="student.sex">性别：{{student.sex}}</h2>
     <h2>年龄：真实：{{student.age.rAge}} --- 对外 {{student.age.sAge}}</h2>
     <h2>朋友们</h2>
     <ul>
        <li v-for="(f,index) in friends">
           {{f.name}} --- {{f.age}}
        </li>
     </ul>
</div>

<script>
   new Vue({
       el:'#root',
       data:{
          name:'atatat',
          address:'shanghai',
          student:{
             name:'张丹'，
             age: {
                rAge: 20,
                sAge: 18
             },
             friends:[
	             {
	                name:'王丹'，
	                age:22,
	             },
	             {
	                name:'李丽'，
	                age:21,
	             }
	          ]
          },
       },
       methods:{
          addSex(){
             Vue.set(this.student,'sex','男')
             this.$set(this.student,'sex','男')
          }
       }
   })

结论：
Vue.set（）可以向vue中添加信息，但是不可以向vue本身和vue的根结点data中直接添加
</script>