经过一段时间的vue学习一次文章做个汇总。一1.v-text v-html {{ }} 插值表达式都可以将vue中data中的数据显示到指定的标签位置中 v-html会将含有html规范的字符串以此规范解析 v-html {{ }}会将数据原样解析2.v-bind 属性绑定可简写为 class“{red:true,thin:false}” (这里的red thin 是在style中定义好的样式)3.v-on 事件绑定可简写为 如 option typebutton click“handClick” 在vue中与data平级的methods中定义 handClick方法(1)事件的修饰符.stop 阻止冒泡事件.prevent 阻止默认事件.once 事件只触发以此.self 只有直接触发本元素时才会触发不会被动触发.capture 添加事件侦听器时 使用事件捕获模式4.v-mode vue中唯一的数据双向绑定元素只能用在表单元件中inputradio text adress email 。select checkbox textarea5.v-for 可以遍历数组对象中的属性 迭代数字v-for“item in 10” 当在组件中使用v-for时必须绑定key key作为每个值得唯一标识key值 必须是有number获取的String 在一些特殊情况下如果v-for有问题在必须使用v-for时 使用唯一的 数字或字符串绑定key值6.v-if 和v-show 前者有更高的切换消耗后者有更高的渲染消耗如果频繁的 隐藏和显示就使用v-show 如果较少就使用v-if二过滤器可以写在差值表达式中 用 | 分割开 如{{ 数据 | 过滤器1 | 过滤器2}}1. 全局过滤器 在script标签中 filter的第一个参数就是 过滤器的名字 后面方法中第一个参数是差值表达式中的数据第二个是要替换的数据。2.私有过滤器在私有过滤器与全局过滤器名称一样时 优先使用私有过滤器如图 times是过滤器名称三1.自定义修饰符例如 keyup是绑定键盘keyup.enter是绑定键盘上的回车键 同时还有.esc /.tab/ .delete/.up /.down /,right /.left 也可以通过查询键盘码进行自定义 如f12的键盘码是113 keyup.113 add()在script中//这样定义完成之后 keyup.f2add() 之后 点击f2就可以执行add方法了Vue.config.keyCodes.f2113;2.自定义指令定义 全局指令 Vue.directive私有指令定义 以及简写 直接上图了这里补充 el为绑定的元素对象 地问个是绑定时传回来的参数