' 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<transition>组件提供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:`<div>组件的模板里面只能够有一个根组件`
}
局部 1 定义组件 let counter={
template:
}
2注册组件new Vue({})
3使用组件