vue比jq好处 1jq 频繁操作dom 增加了性能消耗 vue 模拟dom 从内存中拿 2jq 数据没有统一管理 vue 统一管理数据 3vue 组件开发可以提取出公共的html或js mv*好处 mvc m model 模型 操作数据 v view 视图 展示静态资源 c controller 控制器 逻辑 mvp m model 模型 操作数据 v view 视图 展示静态资源 p 主持人（上面的mvc 中 mv可以互相调用所以改成 mvp让他不能互相调用） mvvm m model 模型 操作数据 v view 视图 展示静态资源 vm 监听m数据改变 同步到v vue 插值 在HTML插入数据 文本 {{data 的建}} v-html {{data的建}}可以解析html代码 指令 通过v-开头的命令显示数据 事件 v-on：事件类型 和 @事件类型 动态参数 动态标签的属性值 bind：属性=“data建” 和：属性=‘data建“ v-for 循环 v-for = “item in 建” v-for = “（item，index） in 建” v-if = “判断条件”不成立的删除 v-show = “判断条件“不成立的隐藏 v-if = “条件” v-else-if = “条件” v-else v-on：事件类型=‘函数’ @事件类型=‘函数’ 事件修饰符 stop阻止冒泡 prevent阻止默认动作 capture打乱冒泡 self阻止冒泡自身 once一次事件 passire 性能 键盘修饰符 enter 回车 delete 删除 space 空格 代码片段的好处 方便快捷搭建vue的mvvm模式的格式 输入绑定/双向绑定 比之jq的添加id属性在获取其内容方便了不少 他是让m的数据同步到v v的数据同步到m class和style绑定 字符串 ：class=“classOne” classOne = “class名” 数组的 ：class=“classArr” classArr =[‘class名1‘，‘class名2’] 对象的 ：class=“classObj” classObj = {class名：布尓类型，class名：布尓类型} todo 是待完成
todolist 是待完成清单
混入（mixin）：减少代码冗余，提高代码复用性 语法 // 全局不用激活直接用 Vue.mixin({ data // 函数里面返回数据对象 methods //.. }) // 局部需要在new Vue中通过mixins激活 let 变量名 = { data // 函数里面返回数据对象 methods //… } new Vue({ // … mixins: [变量名1,…,变量名n] // 脚下留心：变量名不加引号 }) 什么是组件：就是一个文件，后期里面放HTML、CSS、JS 刚好是一个页面 组件好处：可以减少代码冗余，便于后期维护 // 全局（定义好了就可以调用） Vue.component(标识，{ // 通过template键 来 声明HTML代码 template: 1直接写HTML(不推荐), 2写CSS选择器 视图里面通过template来定义选择器 data 是方法里面返回数据对象 methods watch //… }) // 局部 new Vue({ // … // 声明组件 可以写多个 +s components: { 标识: { // 通过template键 来 声明HTML代码 template: 1直接写HTML(不推荐), 2写CSS选择器 视图里面通过template来定义选择器 data 是方法里面返回数据对象 methods watch //… }, //…. } }) 最初ajax 瑕疵：1-异步回调地狱，2-语法麻烦，3-语法有兼容性问题 后来jq 明确：基于ajax封装 好处：语法更简单、解决兼容性问题 瑕疵：异步回调地狱 官方是如何解决异步回调地狱的：promise 最后：fetch 官方封装的 不需要导入库直接使用（fetch = XMLHttpRequest + promise） 明确：vue 以前 vue-resource（官方的 后来官方推荐别用 推荐你用axios 第三方的） 相同点： 1.都是项目用来发送异步请求的 2.都是基于XMLHttpRequest + promise 不同点： 1- axios是第三方封装的，fetch是官方封装的 2- axios更强（并发&拦截器 -> 写项目说） 3- fetch每次都需要then res.json() axios({ url method headers params get data post }).then().catch() fetch(请求地址，{ method headers body }).then(res=>res.json()).then().catch() 1计算属性（直接通过函数名调用） 侦听器（不能调用 借助模型调用） 2计算属性（有缓存） 侦听器（没有） 3计算属性（一个【键/函数名】监控【n个数据变化 用了几个就监控几个】） 侦听器 （一个【键/函数名】监控【一个数据变化】） 普通方法：1-事件触发用，2-减少视图冗余用 计算属性：普通方法单个调用影响性能，用计算属性 侦听器：监控模型数据变化，并且写其他逻辑 （一般网站搜索） 区别 相同点：都是为了优化项目 不同点： 1-计算属性（函数名不叫小括号） 侦听器（不能调用 需要借助模型） 2-计算属性（有缓存） 侦听器（没有） 3-计算属性（一个键可以监控n个模型数据） 侦听器（一个键只能监控一个）