Vue基础知识二

1、MVVM模型

M:模型(Model)——对应data中的数据
V:视图(View)——模板代码
VM:视图模型(ViewModel)——Vue实例对象
<!-- View -->
<div id="root">
　　<h1>学校名称，{{name}}</h1>
　　<h1>学校地址，{{address}}</h1>
</div>

<script>
　　Vue.config.productionTip = false

　　//ViewModel——中间的桥梁
　　var vm = new Vue({
　　　　el:'#root',
　　　　data:{
　　　　　　//Model
　　　　　　name:'前端',
　　　　　　address:'杭州'
　　　　}
　　})
　　// v.$mount('#root')
</script>

2、数据代理

通过vm对象来代理对data对象中属性的操作(读/写)
Object.defineProperty方法
<script>
　　let person = {
　　　　name:'张三',
　　　　sex:'男',
　　}
　　Object.defineProperty(person,'age',{
　　　　value:18,
　　　　enumerable:true,//控制属性是否可以枚举，默认值是false
　　　　writable:true,//控制属性是否可以被修改，默认值是false
　　　　configurable:true,//控制属性是否可以被删除，默认值是false
　　　　get(){},//读取——getter
　　　　set(){}//修改——setter
　　})
　　console.log(person)
</script>