李南江

VUE系列之李南江写VUE源码

余生长醉 提交于 2020-03-01 13:40:57
一 VUE响应式原理 第一部分: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>01-Vue基本模板</title> <!--1.下载导入Vue.js--> <script src="js/vue.js"></script> </head> <body> <div id="app"> <input type="text" v-model="name"> <p>{{ name }}</p> </div> <script> // 2.创建一个Vue的实例对象 let vue = new Vue({ // 3.告诉Vue的实例对象, 将来需要控制界面上的哪个区域 el: '#app', // 4.告诉Vue的实例对象, 被控制区域的数据是什么 data: { name: "李南江" } }); /* 1.Vue响应式的原理(数据改变界面就会改变)是什么? 时时监听数据变化, 一旦数据发生变化就更新界面 2.Vue是如何实现时时监听数据变化的? 通过原生JS的defineProperty方法 3.defineProperty方法的特点 可以直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象 4.defineProperty用法 obj: 需要操作的对象 prop: