File tree Expand file tree Collapse file tree 4 files changed +15
-18
lines changed
src/components/sketchydiv Expand file tree Collapse file tree 4 files changed +15
-18
lines changed Original file line number Diff line number Diff line change 1
1
<template >
2
- <SketchyDiv >INsied</SketchyDiv >
2
+ <SketchyDiv class = " pd " >INsied</SketchyDiv >
3
3
</template >
4
4
5
5
<script setup>
6
6
import { SketchyDiv } from " codeglynuikit" ;
7
+ // import { SketchyDiv } from '../../lib/src';
7
8
</script >
9
+
10
+ <style >
11
+ .pd {
12
+ padding : 80px ;
13
+ }
14
+ </style >
Original file line number Diff line number Diff line change 7
7
onUpdated ,
8
8
ref ,
9
9
useCssModule ,
10
- watch ,
11
10
} from " vue" ;
12
11
import rough from " roughjs" ;
13
12
@@ -67,10 +66,6 @@ export default {
67
66
}
68
67
return updatedClasses;
69
68
});
70
- watch (props, () => {
71
- clearCanvas ();
72
- drawDiv ();
73
- });
74
69
75
70
function drawDiv () {
76
71
const rc = rough .canvas (canvasRef .value );
@@ -87,26 +82,19 @@ export default {
87
82
size .value .width = containerRef .value .clientWidth ;
88
83
size .value .height = containerRef .value .clientHeight ;
89
84
drawDiv ();
90
-
91
- // This part automatically update the convas as it's external parent's size is updated
92
- // const contResizeObserver = new ResizeObserver(() => {
93
- // if (containerRef.value) {
94
- // size.value.width = containerRef.value.clientWidth;
95
- // size.value.height = containerRef.value.clientHeight;
96
- // clearCanvas();
97
- // drawDiv();
98
- // }
99
- // });
100
- // contResizeObserver.observe(containerRef.value);
101
85
});
102
86
});
103
87
onUpdated (() => {
104
88
nextTick (() => {
89
+ size .value .width = containerRef .value .clientWidth ;
90
+ size .value .height = containerRef .value .clientHeight ;
105
91
clearCanvas ();
106
92
drawDiv ();
107
93
});
108
94
});
109
95
96
+
97
+
110
98
return () => {
111
99
const child = [
112
100
h (" canvas" , {
@@ -139,4 +127,6 @@ export default {
139
127
left : 0 ;
140
128
right : 0 ;
141
129
}
130
+
131
+
142
132
</style >
Original file line number Diff line number Diff line change @@ -21,6 +21,6 @@ export default defineConfig({
21
21
} ,
22
22
} ,
23
23
} ,
24
- cssCodeSplit : false
24
+ // cssCodeSplit: false
25
25
} ,
26
26
} ) ;
You can’t perform that action at this time.
0 commit comments