github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

doc: update drag modal demo

pull/4757/head
tangjinzhou 2022-04-24 09:59:09 +08:00
parent f081707576
commit c127bac6fe
1 changed files with 14 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
components/modal/demo/modal-render.vue
View File

@ -51,29 +51,28 @@ export default defineComponent({
}; };
const startX = ref<number>(0); const startX = ref<number>(0);
const startY = ref<number>(0); const startY = ref<number>(0);
const startUpdatePos = ref(false); const startedDrag = ref(false);
const transformX = ref(0); const transformX = ref(0);
const transformY = ref(0); const transformY = ref(0);
const preTransformX = ref(0); const preTransformX = ref(0);
const preTransformY = ref(0); const preTransformY = ref(0);
let timeoutId; watch([x, y], () => {
if (!startedDrag.value) {
startX.value = x.value;
startY.value = y.value;
preTransformX.value = transformX.value;
preTransformY.value = transformY.value;
}
startedDrag.value = true;
});
watch(isDragging, () => { watch(isDragging, () => {
clearTimeout(timeoutId); if (!isDragging) {
timeoutId = setTimeout(() => { startedDrag.value = false;
if (isDragging.value) { }
startX.value = x.value;
startY.value = y.value;
preTransformX.value = transformX.value;
preTransformY.value = transformY.value;
startUpdatePos.value = true;
} else {
startUpdatePos.value = false;
}
}, 50);
}); });
watchEffect(() => { watchEffect(() => {
if (startUpdatePos.value) { if (startedDrag.value) {
transformX.value = preTransformX.value + x.value - startX.value; transformX.value = preTransformX.value + x.value - startX.value;
transformY.value = preTransformY.value + y.value - startY.value; transformY.value = preTransformY.value + y.value - startY.value;
} }