先给下载地址

https://files.cnblogs.com/files/maruihua/el-dragDialog.rar

需要注意的是如果给模态框加入拖动指令,一些定位样式会出问题,需谨慎

具体使用方法如下

在引用页面加入以下代码

import elDragDialog from '../../directive/el-dragDialog/index'
export default {
//自定义指令:拖动模态框
directives: { elDragDialog },
methods: {
handleDrag() {} //拖动模态框事件
}
}

在dialog中加入这两个属性

 <el-dialog
v-el-drag-dialog
@dragDialog="handleDrag" >
</el-dialog>

就可以了,.有什么自定义的样式可以自己修改源码.

关于element-ui的diallog拖动的实现的更多相关文章

  1. 使用element ui 日期选择器获取值后的格式问题

    一般情况下,我们需要给后台的时间格式是: "yyyy-MM-dd" 但是使用Element ui日期选择器获取的值是这样的: Fri Sep :: GMT+ (中国标准时间) 在官 ...

  2. element ui 1.4 升级到 2.0.11

    公司的框架 选取的是 花裤衩大神开源的 基于 element ui + Vue 的后台管理项目, 项目源码就不公开了,记录 分享下 步骤 1. 卸载 element ui 1.4的依赖包 2. 卸载完 ...

  3. [坑况]饿了么你是这样的前端——vue+element ui 【this dependency was not found:'element-ui/lib/theme-chalk/index.css'】

    element ui 坑况:今日pull代码,潇洒npm run dev ,被告知:this dependency was not found:'element-ui/lib/theme-chalk/ ...

  4. Vue + Element UI项目初始化

    1.安装相关组件 1.1安装Node 检查本地是否安装node node -v 如果没有安装,从Node官网下载 1.2安装npm npm -v 如果没有安装:使用该指令安装: npm install ...

  5. Element UI——本地引入iconfont不显示

    前言 前面因为本地引入Element UI导致了iconfont不显示,所以只好再去Element UI官网去扒下iconfot 步骤 进入官网 组件 | Element UI F12进入控制台,找到 ...

  6. Html | Vue | Element UI——引入使用

    前言 做个项目,需要一个效果刚好Element UI有,就想配合Vue和Element UI,放在tp5.1下使用,但是引入在线的地址各种报错,本地引入就完美的解决了问题! 代码 __STATIC_J ...

  7. 分享一个自搭的框架,使用Spring boot+Vue+Element UI

    废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...

  8. 上传图片组件封装 element ui

    // element ui 文档地址: http://element.eleme.io/#/zh-CN <template> <div> <div class=" ...

  9. vue项目使用element ui的Checkbox

    最近使用到element ui的下拉多选框Checkbox Checkbox用法可参考与于 http://element.eleme.io/#/zh-CN/component/checkbox Che ...

  10. vue的$nextTick使用总结,this.$refs为undefined的解决办法,element Ui的树形控件setCheckedKeys方法无法使用

    其实这3个讲的是一个问题,先说下问题,我在watch里设置一个监听,当弹窗打开时,自动添加树形的默认选中项, 但奇怪的是this.$refs为undefined,自然setCheckedKeys无法使 ...

随机推荐

  1. Spring AOP Capability and Goal

    AOP Capability: 1.Spring声明式事务管理配置. 2.Controller层的参数校验. 3.使用Spring AOP实现MySQL数据库读写分离案例分析 4.在执行方法前,判断是 ...

  2. Linux内存管理-内核的shmall和shmmax参数(性能调优)(转)

    内核的shmall和shmmax参数 SHMMAX=配置了最大的内存segment的大小:这个设置的比SGA_MAX_SIZE大比较好. SHMMIN=最小的内存segment的大小 SHMMNI=整 ...

  3. vs2015编译zlib1.2.8

    编译最新的libcurl 7.44.0时须要先编译下zlib 1.2.8遇到了点小麻烦 记录下 1.编译步骤 a.先用vs2015命令行运行下bld_ml32.bat批处理 b.将inffas32.o ...

  4. Java 8中的时间

    Java 8中的时间 学习了:https://blog.csdn.net/sun_promise/article/details/51383618

  5. [Javascript] Link to Other Objects through the JavaScript Prototype Chain

    Objects have the ability to use data and methods that other objects contain, as long as it lives on ...

  6. Office EXCEL 的绝对引用和相对引用如何理解

    比如C1 = A1+B1,则我把C1的单元格往下拖拉的时候,C2会自动等于A2+B2,C3会自动等于A3+B3,而如果让G1 = $E$1+$F$1,则把G1单元格往下拖拉的时候,G2G3单元格都不会 ...

  7. 关于Scrum

    最近某些产品经理发出下两周的工作计划的时候,喜欢带上sprint这个字眼,看上去貌似是要走敏捷开发这一套,只可惜,我觉得他表现出来的是对敏捷开发和Scrum一窍不通,甚至对软件开发流程都完全不清楚,居 ...

  8. 《The Swift Programming Language》的笔记-第28页

    页 本页里的主要内容是: 1 介绍swift语言里的各类数制,或者说某一整数的不同表示形式. 1)十进制,无前缀 的序列 3)八进制,以0o开头.后边是若干0~7的序列 进制,以0x开头.后是0~9. ...

  9. STM32通过调用库函数进行编程

    1.调用库函数编程和直接配置寄存器编程的差别: 2.CMSIS标准: 3.STM32库函数的组织: 4.程序例举: 调用库函数实现通过USART发送数据(26个大写的英文字母) 首先:在主函数部分先要 ...

  10. 【iOS系列】-iOS中内存管理

    iOS中创建对象的步骤: 1,分配内存空间,存储对象 2,初始化成员变量 3,返回对象的指针地址 第一:非ARC机制: 1,对象在创建完成的同时,内部会自动创建一个引用计数器,是系统用来判断是否回收对 ...