1
1
<script lang="ts" setup>
2
- import " ./index.less" ;
3
-
4
- import type { TooltipProps } from " ./types" ;
5
2
import type {
6
3
PopperTrigger as _PopperTrigger ,
7
- Placement ,
8
4
ContentComponentInstance ,
5
+ Placement ,
9
6
} from " ../popper/index" ;
10
7
11
- import LayPopper from " ../popper/popper.vue" ;
12
- import { computed , nextTick , onMounted , ref , shallowRef , unref } from " vue" ;
8
+ import type { TooltipProps } from " ./types" ;
13
9
import {
14
10
useEventListener ,
15
- useResizeObserver ,
16
11
useMutationObserver ,
12
+ useResizeObserver ,
17
13
} from " @vueuse/core" ;
18
14
15
+ import { computed , nextTick , onMounted , ref , shallowRef , unref } from " vue" ;
16
+ import LayPopper from " ../popper/popper.vue" ;
17
+ import " ./index.less" ;
18
+
19
19
export type PopperTrigger = _PopperTrigger ;
20
20
21
21
defineOptions ({
@@ -52,21 +52,23 @@ const popperProps = computed(() => {
52
52
};
53
53
});
54
54
55
- const setEllipsis = function () {
55
+ function setEllipsis () {
56
56
if (tooltipRef .value ) {
57
- let tooltipHtml = tooltipRef .value ;
57
+ const tooltipHtml = tooltipRef .value ;
58
58
if (
59
- tooltipHtml .scrollWidth > tooltipHtml .clientWidth ||
60
- tooltipHtml .scrollHeight > tooltipHtml .clientHeight
59
+ tooltipHtml .scrollWidth > tooltipHtml .clientWidth
60
+ || tooltipHtml .scrollHeight > tooltipHtml .clientHeight
61
61
) {
62
62
disabledPopper .value = false ;
63
- } else {
63
+ }
64
+ else {
64
65
disabledPopper .value = true ;
65
66
}
66
- } else {
67
+ }
68
+ else {
67
69
disabledPopper .value = false ;
68
70
}
69
- };
71
+ }
70
72
71
73
onMounted (() => {
72
74
if (props .isAutoShow ) {
@@ -89,40 +91,41 @@ onMounted(() => {
89
91
});
90
92
});
91
93
92
- const show = function () {
94
+ function show () {
93
95
nextTick (() => {
94
96
popperRef .value ! .show ();
95
97
});
96
- };
98
+ }
97
99
98
- const doHidden = function () {
100
+ function doHidden () {
99
101
nextTick (() => {
100
102
popperRef .value ! .hidden ();
101
103
});
102
- };
104
+ }
103
105
104
- const update = function () {
106
+ function update () {
105
107
nextTick (() => {
106
108
popperRef .value ! .update ();
107
109
});
108
- };
110
+ }
109
111
110
112
defineExpose ({ show , hide: doHidden , update });
111
113
</script >
114
+
112
115
<template >
113
- <lay-popper ref =" popperRef" v-bind =" popperProps" >
114
- <div ref = " tooltipRef " v-if =" isAutoShow" class =" lay-tooltip-content" >
116
+ <LayPopper ref =" popperRef" v-bind =" popperProps" >
117
+ <div v-if =" isAutoShow" ref = " tooltipRef " class =" lay-tooltip-content" >
115
118
<span >
116
- <slot ></ slot >
119
+ <slot / >
117
120
</span >
118
121
</div >
119
- <slot v-else ></ slot >
122
+ <slot v-else / >
120
123
<template #content >
121
124
<slot name =" content" >
122
125
<span v-if =" content" >
123
126
{{ content }}
124
127
</span >
125
128
</slot >
126
129
</template >
127
- </lay-popper >
130
+ </LayPopper >
128
131
</template >
0 commit comments