网页制作基础教程电子工业出版社,合肥seo排名扣费,网站首页收录没了,海沧建设网站多少钱使用vue的都知道vue有一个自定义指令#xff0c;我比较喜欢的就是拖拽的自定义指令#xff0c;感觉挺方便的#xff01; //组件内的拖拽指令
directives: {//组建内自定义指令drag: {// 指令的定义bind: function(el, value) {let oDiv el; //当前元素let self this; //上…使用vue的都知道vue有一个自定义指令我比较喜欢的就是拖拽的自定义指令感觉挺方便的 //组件内的拖拽指令
directives: {//组建内自定义指令drag: {// 指令的定义bind: function(el, value) {let oDiv el; //当前元素let self this; //上下文oDiv.ontouchstart function(e) {//鼠标按下计算当前元素距离可视区的距离let disX e.touches[0].clientX - oDiv.offsetLeft;let disY e.touches[0].clientY - oDiv.offsetTop;oDiv.style.zIndex 3;document.ontouchmove function(e) {//通过事件委托计算移动的距离let l e.touches[0].clientX - disX;let t e.touches[0].clientY - disY;//移动当前元素// oDiv.style.left l px;document.ontouchend function(e) {oDiv.style.zIndex 2;}document.ontouchmove null;document.ontouchend null;};};}}}
//大致的框架就是这样其中el指的是绑定的元素value就是传的值了用法 div v-drag{data:fills,info:data} 拖拽/div
!--{}里面的全部都是传的参数对应的就是上面的value--上面是拖拽指令的写法及用法但是这并不是主要内容当你移动端使用自定义指令的时候如果你的公司需要兼容各种手机版本以及各种系统版本那么可能你就需要把他撤掉我遇到的就是苹果5s并不支持如果用自定义的指令那么他会闪烁没有内容是白屏状态所以说想要用自定义指令的要考虑考使用环境转载于:https://www.cnblogs.com/ctb-web/p/9360578.html