fix: 修改moadl定义拖拽,和 绑定style left 与top 值后,点击拖拽飘移的问题
This commit is contained in:
parent
a2c5781120
commit
40bf70dd08
2 changed files with 14 additions and 3 deletions
|
@ -1,6 +1,12 @@
|
|||
<template>
|
||||
<div>
|
||||
<Button type="primary" @click="modal1 = true">Display dialog box</Button>
|
||||
<Button type="primary" @click="modal2 = true">Display dialog box</Button>
|
||||
<Modal v-model="modal2" draggable title="Common Modal dialog box title"
|
||||
@on-ok="ok"
|
||||
@on-cancel="cancel">
|
||||
<p>2123</p>
|
||||
</Modal>
|
||||
<Modal
|
||||
v-model="modal1"
|
||||
title="Common Modal dialog box title"
|
||||
|
@ -52,6 +58,7 @@
|
|||
data () {
|
||||
return {
|
||||
modal1: false,
|
||||
modal2: false,
|
||||
cityList: [
|
||||
{
|
||||
value: 'New York',
|
||||
|
|
|
@ -80,7 +80,10 @@
|
|||
default: false
|
||||
},
|
||||
styles: {
|
||||
type: Object
|
||||
type: Object,
|
||||
default() {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
className: {
|
||||
type: String
|
||||
|
@ -199,8 +202,9 @@
|
|||
let style = {};
|
||||
|
||||
if (this.draggable) {
|
||||
let customTop = this.styles.top ? parseFloat(this.styles.top) : 0
|
||||
if (this.dragData.x !== null) style.left = `${this.dragData.x}px`;
|
||||
let customTop = this.styles.top || 0 ? parseFloat(this.styles.top) : 0
|
||||
let customLeft = this.styles.left || 0 ? parseFloat(this.styles.left) : 0
|
||||
if (this.dragData.x !== null) style.left = `${this.dragData.x - customLeft}px`;
|
||||
if (this.dragData.y !== null) style.top = `${this.dragData.y - customTop}px`;
|
||||
const width = parseInt(this.width);
|
||||
const styleWidth = {
|
||||
|
|
Loading…
Add table
Reference in a new issue