1在vue-element-admin-master里找到src/directive/el-drag-dialog文件夹复制到自己的相同目录下

2页面引用
import elDragDialog from ‘@/directive/el-drag-dialog’

export default {
directives: { elDragDialog },
3.标签加入v-el-drag-dialog
 
    <el-dialog v-el-drag-dialog :visible.sync="dialogTableVisible" title="Shipping address">
    </el-dialog>
v-el-drag-dialog
directives: { elDragDialog }
<el-dialog :visible.sync="modalShow" :before-close="modalClose" v-el-drag-dialog>
	内容内容内容
</el-dialog>
import elDragDialog from "...
                                    自定义弹窗拖拽指令
第一步:  src目录下新建目录directive，然后在directive目录下的新建文件el-drag-dialog.js，在该文件里实现了拖拽逻辑。
el-drag-dialog.js文件代码如下：
export default {
    bind(el, binding, vnode) {
        const dialogHeaderEl = el.querySelector('.el-dialog__header')
        const dragDom = e
    if (!binding.value) {
      const dialogHeaderEl = el.querySelector('.el-dialog__header')
      const dragDom = el.querySelector('.el
                                    3、封装拖拽自定义指令 ，在directives文件夹中新建el-drag-dialog文件夹，文件夹内新建drag.js 和index.js 以下是代码。在components中新建dialog.vue。1、项目安装element-ui 并引入。后就可以在可视窗口内自由拖拽移动了。2.封装element-ui的。2、封装打开Dialog方法。以上就是所有代码啦。