2020-03-05

'                                              vue的知识点

---

1指令

(1)文本渲染指令：{{js表达事}}（2）条件渲染（3）属性绑定(4)事件绑定(5)列表渲染

2表单绑定 v-model=""   text   checkbox  单一   

3事件修饰

(1)事件修饰 .stop 停止事件冒泡   .prevent 阻止默认事件  .once 执行一次  @click.prevent="say"

(2)按键修饰符 .enter .tab .delete  .esc .space  .up

4watch监听一个数据

watch:{

"obj":{

handler:function(val){},

deep:true,

}

}

5 computed

从现有数据,计算出来新的数据
{
rmg:function(){

return this.msg.split("").reverse().join("")+

}
}

6filer过滤

filters:{
fix(val,arg1,arg2){
return xxx
}
}

7vue的参数

el指令板  data指定的数据  methods  指定的方法   watch监听   computed计算  filters 过滤

8 directives 自定义指令

作用:1要操作dom时候  2.使用集成第三方插件时候

dirctives:{
img:{
inserted(el,binding)
}
}

}

9class绑定

:class="red blue"属性绑定
:class="{'red':flag}"动态绑定
：class="['red','em']"数组绑定

10style绑定

:style="{fontZise:14px,color:‘blue’}"
:style="obj"
data:{
obj:{"font-size":"48px",fontStyle:}
}

11vue动画

1.Vue它不能直接实现动画,它提动画各阶段需要的
2组件提供class
3.在vue中动画是在元素显示与隐藏的过程中,增加class 实现
4.transition 组件提供 v-enter-active 元素整个过程
v-leave-active 元素整个离开的过程   
 自定义动画名 enter-active-class=""   leave-active- class
动画模式

in-out  先执行动画,在执行离开动画
out-in  先执行离开动画,在执行进入动画
transition -group  组件   tag指定标签  move-class  name 动画名  enter-active-class

12组件

定义1组件就是扩展自定义的html标签    2组件一个 功能的集合  
全局

Vue.component(组件名){
template:`

组件的模板里面只能够有一个根组件`
}

局部 1 定义组件 let counter={
template:
}
2注册组件new Vue({})
3使用组件