
vue
查水表小泰迪
记录学习过程
展开
-
vue中transition动画标签的使用
transition使用的关键就在于;使用name的属性值去拼接enter,enter-to 等类名。这样子就可以触发transtion 的动画了普通的写法 <ms-button @click="handle">按钮</ms-button> <transition name="aa"> <div v-if="!visible">12321321</div> </transition> <.原创 2022-03-24 21:08:42 · 1561 阅读 · 0 评论 -
vue2封装input 组件(输入的双向绑定)
重点首先我们要明白 vue中v-modle 的对于input 做了什么 <input type="text" v-model="username"> <input type="text" :value="username" @input="username = $event.target.value">以上的两行代码,所呈现的效果是一样的。也就是说: v-model=“username” 在input中做了两件事情。:value 绑定了值@input=“user原创 2022-03-22 20:25:54 · 3306 阅读 · 0 评论 -
vue2,vue3 中 v-if 和v-for 指令优先级问题
vue2,vue3 指令执行优先级问题原创 2022-02-17 17:19:55 · 1258 阅读 · 0 评论 -
vue 自定义全局指令-v-drag ,弹窗拖动
1.首先在src目录下建立一个指令文件夹及文件2.进入drag.js,复制下面代码export const drag = { inserted(el) { let oDiv = el // 左边距最大值 let maxLeft = el.parentNode.clientWidth - el.clientWidth // 上边距最大值 let maxTop ...原创 2022-02-11 16:04:13 · 3400 阅读 · 0 评论 -
简单说下VUE 中 $nextTick 的作用
解释nextTick的作用首先得了解js 的时间执行机制,js 事件执行分为 同步和异步,执行的任务又分为宏任务和微任务,js 代码从上到下依次执行,先同后异,先宏后微。 解析:js 代码和计时器等都属于宏任务,像promise .then() 和 process 都属于微任务,每一个宏任务都会产生很多异步和微任务,这些代码都会同步执行完成之后去执行。微任务还在异步任务之后。 而$nextTick 原理其实是采用的process 对象的nextTick 方法...原创 2021-08-24 11:02:03 · 794 阅读 · 0 评论