Vue3与vite

86 阅读1分钟

内置防抖函数方法

此方法不能共用

事件修饰符

  • click.stop 停止事件传递
  • sybmit.prevent 提交事件不重载页面
  • click.stop.prevent 修饰符组合使用 阻止事件传递和提交事件不重载页面
  • click.self 当点击覆盖物时不触发事件 点击元素本身时才出发这个事件
  • click.capture 添加事件监听器时,使用 capture 捕获模式 例如:指向内部元素的事件,在被内部元素处理前,先被外部处理
  • click.once 事件只能触发一次
  • scroll.passive 滚动事件的默认行为触发将立即响应

表单v-mode修饰符

v-model.number 自动转换为数字 v-model.lazy 在change事件发生之后改变 v-model.trim 输入空格时清除空格

vue3生命周期

lifecycle.16e4c08e.png

Vue3 setup 解包和包装的数据方法

  • ref 接收一个响应式的基础数据类型值
  • shollawRef 和ref作用一样 不同的是 ref是深层解包 而shollawRef是浅解包 /shallowRef() 常常用于对大型数据结构的性能优化或是与外部的状态管理系统集成
  • unref 判断这个值是不是ref响应式数据 返回true/false
  • toRef 接收一个Porps组件之间传递的数据
  • toRefs 将一个响应式数据转换为普通数据
  • reactive 接收一个响应式对象
  • readonly()接受一个对象 (不论是响应式还是普通的) 或是一个 [ref]返回一个原值的只读代理。
  • isProxy 检测是否由ref reactive readonly 代理接收的数据 返回true/false
  • isReactive 检测是否由 reactive/shollawReactive代理的数据 返回 true/false