相关文章推荐
爽快的墨镜  ·  Compiler Error CS5001 ...·  4 月前    · 
魁梧的黑框眼镜  ·  使用Python处理百万数据量的Excel文 ...·  1 年前    · 
暗恋学妹的酱肘子  ·  SQL 计算小计和总计-腾讯云开发者社区-腾讯云·  1 年前    · 
俊秀的松球  ·  Exchange Online ...·  1 年前    · 
打酱油的稀饭  ·  valgrind--memcheck原理_r ...·  2 年前    · 
Code  ›  vue.js - vuedraggable拖拽到目标区域的回调事件 -
event vuedraggable
https://segmentfault.com/q/1010000013813828
暗恋学妹的投影仪
2 年前
segmentfault segmentfault
注册登录
问答 博客 标签 活动
发现
✓ 使用“Bing”搜本站 使用“Google”搜本站 使用“百度”搜本站 站内搜索
注册登录
  1. 首页
  2. 问答
  3. vue.js
  4. 问答详情

vuedraggable拖拽到目标区域的回调事件

头像
夏季
34 2 2 10
发布于
2018-03-18

图片描述
我要把item1从A区域拖拽到B区域,
我想在B区域设置监听回调事件,
像jquery-ui 当拖拽元素到B区域并释放鼠标 就会调用drop方法

$(".freeWrap").droppable({
            drop: function( event, ui ) {
                console.log("元素已经在目标区域上方")

vuedraggable有没有像drop这样的方法,我想实现下面这样的一个拖拽功能
图片描述

vue.js draggable
阅读 36.1k
7 个回答
得票 最新
头像
cat2dang
43 2 10
发布于
2018-11-09

在ondragover中一定要执行preventDefault(),否则ondrop事件不会被触发,假设目标元素是target

<div class="target"  @dragover='onDragover' @drop='onDrop'></div>
onDragover(e) {
    e.preventDefault()
onDrop() {
    // 业务代码
头像
toBeTheLight
16.6k 8 32 68
发布于
2018-03-18

会触发sort和add事件。用add吧。

@add="addDrag(event)"
// event里能拿到一些信息,这个event是vuedraggable处理过的
头像
1如既往
167 8 50 94
发布于
2018-04-18

解决问题了吗楼主,我遇到和你一样的问题,求解呀

头像
Evelyn
258 2 26 42
发布于
2018-05-03

请问楼主解决了吗,可以分享下解决方法吗?

头像
ms_liuy
572 2 22
发布于
2018-05-03
直接@drop
 
推荐文章
爽快的墨镜  ·  Compiler Error CS5001 - C# | Microsoft Learn
4 月前
魁梧的黑框眼镜  ·  使用Python处理百万数据量的Excel文件:删除列、切分换行、替换去重_python 怎么对excel表格文本进行批量换行处理-CSDN博客
1 年前
暗恋学妹的酱肘子  ·  SQL 计算小计和总计-腾讯云开发者社区-腾讯云
1 年前
俊秀的松球  ·  Exchange Online 中的移动设备邮箱策略 | Microsoft Learn
1 年前
打酱油的稀饭  ·  valgrind--memcheck原理_ruben_shaw的博客-CSDN博客
2 年前
今天看啥   ·   Py中国   ·   codingpro   ·   小百科   ·   link之家   ·   卧龙AI搜索
删除内容请联系邮箱 2879853325@qq.com
Code - 代码工具平台
© 2024 ~ 沪ICP备11025650号