1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
| <template>
| <!--辅助线-->
| <span
| v-for="(item, index) in lineValue.vLine"
| v-show="item.display"
| :key="index"
| class="ref-line v-line"
| :style="{ left: item.position, top: item.origin, height: item.lineLength }"
| ></span>
| <span
| v-for="(item, index) in lineValue.hLine"
| v-show="item.display"
| :key="index"
| class="ref-line h-line"
| :style="{ top: item.position, left: item.origin, width: item.lineLength }"
| ></span>
| <!--辅助线END-->
| </template>
| <script lang="ts" setup>
| import { useDragLine } from "./hook";
| const { lineValue } = useDragLine();
| </script>
| <style lang="scss" scoped>
| .ref-line {
| position: absolute;
| background-color: rgb(255, 0, 204);
| z-index: 9999;
| }
| .v-line {
| width: 1px;
| }
| .h-line {
| height: 1px;
| }
| </style>
|
|
