|
第二天
单选 在vue中使用方式跟html一模一样，只不过他的值通过vue控制
多选 在vue中使用方式跟html一模一样，只不过他的值通过vue控制
不同点
1 他们都是通过v-model绑定数据的，但是单选的所有v-model是同一个变量，多选的v-model对应一个不同的变量，通常这些变量保存一个变量中方便管理
2 单选的值需要vlaue属性设置，多选不用
3 单选value会映射到v-model上，多选的值默认就是一个boolean值，如果想设置它的值就要通过（true-value和false-value）
4 多选可以通过v-bind:true-value和v-bind:false-value来动态定义其值，单选不可以
相同点
Html中属性的设置（checked）优先级要高于在vue中设置的配置
下拉框
1 想设置多选，要添加multiple属性
2 默认值是选项option内容值，我们可以通过设置value来改变，如果vlaue值和内容是相同的，通常我们可以省略value
3 设置是否被选中有两种方式，
第一种通过属性selected设置
第二种是vue实例化对象中的配置设置，
如果是单选可以直接设置字符串
如果是多选，可以通过数组设置，数组每个成员值对应的就是option的选项值
4 在html中设置的selected属性优先级要高于在vue实例化对象中设置的配置
filterBy 过滤数组，
参数是一个字符串
如果数组成员是一个字符串，过滤时候，会判断每个字符串是否包含该过滤字符串，包含则保留
如果数组成员是一个对象，过滤的时候，会判断每一个对象的属性值是否包含该过滤字符串，如果包含则保留
Josn 将对象转化json字符串
特性属性
Lazy： 在表单元素失去焦点时候出发数据的绑定
Debounce ：当输入后做节流数据绑定，节流事件就是属性的值，单位是毫秒
自定义指令，就是dom上自定义属性，只不过是以v-开头的，并且在将元素渲染到页面时候，会将这些自定义指令属性删除
Vue.directive
第一个参数表示自定义指令名称，没有v-
第二参数有两种方式
如果是一个对象
Bind：当指令绑定时候调用，在一个指令绑定的声明周期中只会执行一次
Update：当没指令内容更新时候，会调用该方法，
作用域是指令实例化对象
第一个参数表示新的数据
第二个参数表示上一个数据
在第一次绑定时候也会执行该方法，但是参数只有一个，就是当前数据
Unbind：当解除绑定会执行
如果是一个函数，这个函数就是update方法，参数以及作用域与update是一致的
自定义过滤器
Vue.filter
第一个参数表示过滤器名称
第二个参数表示过滤函数
第一个参数是处理数据
从第二个参数开始表示过滤器使用时候传递的参数
作用域是vue实例化对象
返回值就是要被渲染的数据
事件
使用事件分成两步
第一步在dom中使用该事件
V-on:click=“clickBtn”
这个回调函数可以不带(),此时他的参数只有一个就是事件对象
如果带().,括号中参数就是在事件回调函数中的参数，想传递事件对象$event
第二步在vue实例化对象中定义该回调函数
定义在methods方法中，methods对应的值是一个对象，
属性名称是方法名称（如果是被事件调用就叫事件回调函数）
属性值是一个函数
作用域是vue实例化对象，可以通过this访问vue实例化对象中任何属性和数据
参数就是使用时传递参数
键盘事件
V-on:keyup.enter=”fn”
我们可以对keyup和keydown添加一些修饰符，来定义一些特殊按钮的回调函数，
Enter，space，tab，esc， up，down，lef， right
V-show 控制元素的显隐
与v-if的区别
V-show，对css中display样式的设置，
V-if是对元素做是否创建的处理
过渡
Transition=“demo”
Transition的值就是要添加类名称前缀
会创建三个类，demo-transition ，
demo-leave， demo-enter，通过这几个类，我们可以定义一些过渡
|
