2020-08-13 11:47:56 +08:00
|
|
|
<template>
|
|
|
|
<article>
|
|
|
|
<div
|
|
|
|
ref="target1"
|
|
|
|
v-drag:target1,target2,target3.translate
|
|
|
|
class="target"
|
|
|
|
>
|
|
|
|
主元素
|
|
|
|
</div>
|
|
|
|
<div
|
|
|
|
ref="target2"
|
|
|
|
class="target"
|
|
|
|
/>
|
|
|
|
<div
|
|
|
|
ref="target3"
|
|
|
|
class="target"
|
|
|
|
/>
|
|
|
|
</article>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2021-09-17 19:41:59 +08:00
|
|
|
import { drag } from 'veui'
|
2020-08-13 11:47:56 +08:00
|
|
|
|
|
|
|
export default {
|
|
|
|
directives: {
|
|
|
|
drag
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
2021-09-15 20:03:51 +08:00
|
|
|
<style lang="less" scoped>
|
2020-08-13 11:47:56 +08:00
|
|
|
.target {
|
2021-09-15 20:03:51 +08:00
|
|
|
width: 80px;
|
|
|
|
height: 80px;
|
|
|
|
background: #e7e7e7;
|
2020-08-13 11:47:56 +08:00
|
|
|
display: inline-flex;
|
|
|
|
margin-right: 40px;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
|
|
|
vertical-align: top;
|
|
|
|
}
|
|
|
|
|
|
|
|
.container {
|
2021-09-15 20:03:51 +08:00
|
|
|
width: 100%;
|
|
|
|
height: 300px;
|
|
|
|
background: #f7f7f7;
|
2020-08-13 11:47:56 +08:00
|
|
|
}
|
|
|
|
</style>
|