Vue+el-tree，元素拖拽时出现禁用图标，请看解决办法

项目需求：vue+el-tree实现节点拖拽到指定div播放视频；

问题：当节点拖拽时，出现禁用图标；

一开始以为将禁用图标改变样式或隐藏就可以，一番尝试后，发现这个图标可能是浏览器默认的，经过研究，因为目标元素默认是禁止放置的，所以当拖拽元素进入到目标元素时鼠标位置会出现禁用图标；

解决方法：

//将div变为可拖放容器dragenter() {var outer = document.getElementsByClassName("videoNull");outer = Array.from(outer);outer.forEach(function (item) {item.ondragover = dragover;});function dragover(event) {// 阻止默认行为，变成可放置的event.preventDefault();}},

  mounted() {this.dragenter();},

注意：最后别忘了调用该方法哦

代码：

//将div变为可拖放容器

dragenter() {

var outer = document.getElementsByClassName("元素类名");

outer = Array.from(outer);

outer.forEach(function (item) {

item.ondragover = dragover;

});

function dragover(event) {

// 阻止默认行为，变成可放置的

event.preventDefault();

}

在此声明：本人菜鸡一枚，发帖是为了记录在开发中遇到的一些问题，同时也希望可以帮助遇到同类问题的朋友们，解决办法可能有点low，大佬勿喷哈~~~

Vue+el-tree，元素拖拽时出现禁用图标，请看解决办法相关推荐

图片img或者含有img元素拖拽时，或者scale缩放时产品的阴影效应问题
图片img或者含有img元素拖拽时,或者用scale缩放时产品的阴影效应问题 html中有图片img或者含有img元素拖拽时,或者scale缩放时产品的阴影效应问题,也就是图片重影, 另外使用scal ...
图片img或者含有img元素拖拽时的阴影效应问题
<body><img src="地鼠洞.jpg" alt=" ...
实现元素拖拽放大缩小_Vue实战067：DOM元素拖拽效果的实现
DOM元素拖拽效果: 当鼠标选中目标元素之后可以将其拖放至指定区域的任意位置,实现的思路主要是通过鼠标事件按下.移动.抬起,摁下鼠标时记录鼠标位置以及元素位置并算出鼠标相对元素的位置,在拖拽时记下当前 ...
Vue.Draggable 实现组件拖拽
Vue.Draggable 实现组件拖拽特性支持触摸设备支持拖拽和选择文本支持智能滚动支持不同列表之间的拖拽不以jQuery为基础和视图模型同步刷新和vue2的国度动画兼容支持撤销操 ...
vue+sortable实现表格拖拽
vue+sortable实现表格拖拽前言: 支持 vue3.0 支持表格拖拽支持自定义拖拽 sortable官网一.下载 sortable npm install sortablejs --sa ...
php 元素拖拉,Draggable Elements 元素拖拽功能实现代码_javascript技巧
当然我们可以研究js库的源码, 也可以自己去发明轮子试试看, 其过程还是挺有趣的...下面我就来实现下页面元素的拖拽功能现在就开始着手实现, 让我们从最顶层的方法讲起, 它用于初始化一个drag o ...
dom 元素拖拽实现
文章目录原生 JS 实现 div 拖拽 HTML 拖拽 API REF 之前找实习的时候,面试官出了道 "原生 JS 实现 div 元素拖拽",当时实现了个大概,不过很多细节 ...
jquery回弹_创意网页DOM元素拖拽弹性反弹和变形动画特效
这是一款非常有创意的HTML网页DOM元素拖拽弹性反弹和变形动画特效.这个特效中有两种效果:第一种是弹性模态窗口效果,第二种是弹性幻灯片效果.这两种效果均可以拖拽DOM元素,然后释放它们时生成非常震撼 ...
Android仿探探卡片拖拽,Vue 仿探探拖拽卡片的效果
原标题:Vue 仿探探拖拽卡片的效果已更新Vue3版,请给前端大全发送关键字vue3仿探探获取Vue3版类似 Tinder 和探探的卡片效果的组件,社区中已经非常多了.我这一版除了可以实现和他 ...

Vue+el-tree，元素拖拽时出现禁用图标，请看解决办法

Vue+el-tree，元素拖拽时出现禁用图标，请看解决办法相关推荐

最新文章

热门文章

Vue+el-tree，元素拖拽时出现禁用图标， 请看解决办法

Vue+el-tree，元素拖拽时出现禁用图标， 请看解决办法相关推荐

最新文章

热门文章

Vue+el-tree，元素拖拽时出现禁用图标，请看解决办法

Vue+el-tree，元素拖拽时出现禁用图标，请看解决办法相关推荐