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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
| <template>
| <el-tooltip :show-after="200" placement="top" effect="dark">
| <div class="defaultDisplay" :style="{textAlign}">
| <slot name="default" />
| </div>
| <template #content>
| <span class="popUpContent" @click="clickTest">{{ showCopyText ? '复制' : content }}</span>
| </template>
| </el-tooltip>
| </template>
| <script setup>
| import { ElMessage } from 'element-plus'
|
| const props = defineProps({
| content: {
| type: String,
| required: true
| },
| showCopyText: {
| type: Boolean,
| default: false
| },
| textAlign:{
| type: String,
| default: 'center'
| }
| })
|
| function clickTest(e) {
| navigator.clipboard
| .writeText(props.content)
| .then(() => {
| ElMessage.success('复制成功！')
| })
| .catch(() => {
| ElMessage.error('复制失败，请重试！')
| })
| }
| </script>
| <style scoped lang="scss">
| .popUpContent{
| cursor: pointer;
| }
|
| .defaultDisplay{
| display: inline-block;
| width: 100%;
| white-space:nowrap;
| overflow: hidden;
| text-overflow: ellipsis;
| }
| </style>
|
|
