vue的知识点复习

mvvm是什么
m 是vue实例中的data,自定义的数据或后端返回的数组不是后端mvc里的model概念不同。
vm 是vue的实例 m和v之间的调度者 是mvvm的核心思想
v是 html 要渲染的。
常用指令
v-cloak 解决{{}}插值闪烁问题
v-text 会先执行 覆盖 元素中原本的内容 但是插值表达式只会覆盖自己的占位符，默认不会闪烁
v-html 渲染 html标签 覆盖元素中原有元素内容
v-bind: 简写为: 用来绑定数据 可以写合法的js表达式
v-on: 简写为 @ 用来点击事件
v-if:DOM渲染与不渲染，不能和v-for一起使用
v-for:循环渲染DOM，循环时要加v-key唯一标识，循环时不能和v-if一起使用，可以用computed计算属性再循环
v-model:双向数据绑定，一般用于表单
v-show:DOM隐藏与显示，和v-if区别在于v-show是利用css控制，实际上DOM已经渲染了，而v-if是渲染与不渲染。如果DOM频繁切换可以用v-show,反之用v-if。
常用事件修饰符
stop 阻止冒泡 ：外层和里层都有方法 点击里层会产生冒泡，也会触发外层的事件。顺序 从里到外产生事件
prevent 阻止浏览器默认行为 ：a标签有浏览器默认行为。
capture 捕获事件 ：点击里层先触发外层再触发里层 顺序从外到里产生事件
self 只触发自己本身的事件 不会产生冒泡和捕获事件 类似于阻止冒泡 但只针对自己那一层 最外层还是会被最里层冒泡冒到 stop 是阻止所有层次
once 事件只执行一次
 数据的绑定
v-bind: 数据的单向绑定
v-modle :数据的双向绑定 这个只能用于表单元素中

v-for的使用

1. 可以遍历: 普通数组,对象数组,对象,还可以是数字

  v-if、v-show

v-if 有较高的切换性能 , 适合元素可能永远不会被用户看到。
v-show 有较高的初始渲染消耗,适合元素频繁切换。
生命周期 函数
beforeCreate()：这是我们遇到的第一个生命周期函数,表示实例完全被创建出来之前,会执行它…
created(): 这是遇到的第二个生命周期函数…
beforeMount()：这是遇到的第3个生命周期函数,表示 模板已经在内存中编辑完成,但是尚未把模板渲染(挂载)到页面中。在 beforeMount 执行的时候,页面中的元素,还没有被真正替换过来,只是之前写的一些模板字符串。就像{{text}}这样
mounted()：这是遇到的第四个生命周期函数,表示内存中的模板,已经真实的挂载到了页面中,用户已经可以看到渲染好的页面了。只要执行完这个生命周期,就表示整个vue实例已经初始化完毕了，此时，组件已经脱离了创建阶段，进入到了运行阶段。
beforeUpdate()：这时候表示,我们的界面还没有被更新[但数据已经被更新了页面中显示的数据，还是旧的，此时data数据是最新的。页面尚未和最新的数据保持同步
update() : 这一步执行的是 先根据data中最新的数据，在内存中重新渲染出一份最新的内存dom树,当最新的内存dom树被更新后,会把最新的内存DOM树重新渲染到真实的页面中去,这时候，就完成了数据data(model层)->view(视图层)的更新，页面和data数据已经保持同步了,都是最新的。
beforeDestory :当执行 beforeDestory 钩子函数的时候,Vue实例就已经从运行阶段,进入到销毁阶段, 当执行beforeDestroy的时候，实例身上所有的data和所有的methods以及过滤器、指令…都处于可用状态,此时,还没有真正执行销毁的过程。
destroyed :当执行这个函数的时候,组件已经被完全销毁了,此时，组件中所有的数据,方法，指令，过滤器…都已经不可用了