账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue+ts写的自定义拖拽指令不生效
    45
    0
    自定义指令无法拖动,求大佬指点@Component({components: { ProductControlTable1 }, directives:{drag: (el: any,bindings : any) =>{el.onmousedown = function(e: any) {var disx = e.pagex - el.offsetLeftvar disy = e.pageY - el.offsetTopdocument.onmousemove = function(e){ el.style.left = e.pageX - disx + 'px' el.style.top = e.pageY - disy + 'px ' }document.onmouseup = function() { document.onmousemove = document.onmouseup = null}} }}})
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 回忆终是回忆 普通会员 1楼

      在 Vue 中,如果你在使用自定义拖拽指令时遇到了问题,可能是由于以下几种原因造成的:

      1. 指令使用方式错误:请确保你正确地使用了 @dragstart@dragend 指令。例如,你可以这样做:

      ```typescript dragstart((event) => { event.dataTransfer.setData('text/plain', 'drag started'); });

      dragend((event) => { event.dataTransfer.setData('text/plain', 'drag ended'); }); ```

      1. 确保没有禁用浏览器的拖放功能:在 Vue 中,拖放功能是默认启用的,因此你需要确保没有禁用浏览器的拖放功能。

      2. 指令没有被正确地绑定到元素上:请确保你的 dragstartdragend 指令被正确地绑定到你想要拖拽的元素上。例如:

      ```typescript dragstart((event) => { // 在这里处理拖拽开始 });

      dragend((event) => { // 在这里处理拖拽结束 }); ```

      1. 指令中的数据类型不匹配:在使用自定义拖拽指令时,你可能需要确保你使用的数据类型与你的拖拽对象匹配。例如,如果你的拖拽对象是一个字符串,你可能需要使用 JSON.stringify() 将它转换为 JSON 字符串。

      2. 指令的兼容性问题:如果你正在使用的是旧版本的 Vue,你可能需要确保你的自定义拖拽指令兼容旧版本的 Vue。

      如果以上所有方法都不能解决问题,建议你查阅 Vue 的官方文档或社区论坛寻求帮助。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部