vue修饰符

表单修饰符

  • .lazy 懒加载,输完失去焦点才触发事件
<div>
   <input type="text" v-model.lazy="value">
   <p>{{value}}</p>
</div>
  • .trim 过滤首尾的空格,不会过滤中间的
  • .number 限制输入的是数字,如果先输入数字才能限制,先输入字符串则限制不了

事件修饰符

  • .stop 阻止事件冒泡
  • .prevent 阻止默认行为
  • .self 自身触发才执行
  • .once 只执行一次
  • .cupture 让事件从冒泡阶段--目标阶段--捕获阶段
  • .passive 滚动事件的懒加载,移动端常用,不会滚一点点就触发
  • .native 自定义组件绑定事件,像给UI框架绑定事件需要使用
    注意:使用.native修饰符来操作普通HTML标签是会令事件失效的

鼠标按钮点击click+

  • .left 左键点击
  • .right 右键点击
  • .middle 中键点击
<button @click.right="shout(1)">ok</button>

键值修饰符 事件keyuo/keydown

  • .keyCode 当按下某个键才执行
    普通键
  • .enter
  • .tab
  • .delete (捕获“删除”和“退格”键)
  • .space
  • .esc
  • .up
  • .down
  • .left
  • .right
    系统修饰键
  • .ctrl
  • .alt
  • .meta
  • .shift

vue修饰符

上一篇:图片局部放大镜


下一篇:【LeetCode-713】乘积小于K的子数组