vue的知识体系
1,基本使用
2,组件使用
3,高级使用
1.1模板
1.1.1 v-html尽量不要使用容易造成xss攻击
1.1.2 绑定指令v-bind
1.1.3 插值
{{name}}
1.2 computed 计算属性,会生成新的数据,不会改变 data中的数据,一般用在多个属性去改变某一属性,会有缓存,在多个地方用到计算后的属性,执行一次就行,减少cpu压力
1.3 watch 监听数据变化,监听单个属性,就是基本数据类型,对于引用数据类型要用到深度监听deep,多个引用类型监听,循环就行
1.4 class和style动态样式控制,这个很简单了,就是不同的class有不同的样式,动态换掉class就行了
1.5 条件渲染 v-if和v-show,v-if是重新渲染和销毁,一般用在切换比较少的时候,减少cpu压力,v-show是控制display的显示和隐藏
1.6 循环渲染 v-for,必须要有key,这个key不能是随机数或者相同的值,再好用后端返回的id,会影响到diff算法对比挂载虚拟DOM,也不要和v-if一起在同一个标签上使用,v-for的优先级大于v-if,这样就会造成循环体内每个元素都会有v-if这个不是我们想要的结果,可以在父标签上添加v-if 指令
1,7 事件 分为传值和不传值,不传值的时候在<div @click=“handleClick”>直接调用就行,也可以handleClick(),但是传值的事件调用要添加 e v e n t < d i v @ c l i c k = " h a n d l e C l i c k ( 值 , event<div @click="handleClick(值, event<div@click="handleClick(值,event)">
1.8 表单 v-model在表单的input,textarea等绑定值
1.9修饰符 事件的修饰符<div @click.stop=“handleClick”>,常见的还有perevent,shif,once等,v-model修饰符
**在结合第三方库,vuex,vue-router等,一些不是特别复杂的项目完全够用了