iview modal 弹窗拖出边界就拖不回来了,并且关闭后再打开还是在原位置,必须刷新页面才可正常显示,问题图片如下
解决思路:
1、改源码,太麻烦直接pass
2、用自定义指令覆盖原实现
废话不多说,直接上源码
//vue绑定事件的工具类
import {
off, on} from './components/libs/dom'
Vue.directive('dragControl', {
bind: function (el, binding, vnode) {
let componentInstance = vnode.componentInstance;
el.dataset.initWidth = componentInstance.width.toString();
el.dataset.visible = componentInstance.visible.toString();
//获取modal 的底部
let footer = componentInstance.$refs.content.getElementsByClassName("ivu-modal-footer");
let customFooter = componentInstance.$refs.content.getElementsByClassName("panel-footer");
if (footer.length > 0) {
footer[0].style.cssText = "cursor: move";
//modal 底部绑定mousedown事件
on(footer[0], "mousedown", componentInstance.handleMoveStart);
}
if (customFooter.length > 0) {
customFooter[0].style.cssText = "cursor: move";
//modal 底部绑定mousedown事件
on(customFooter[