fix: 鼠标手势显示
This commit is contained in:
@ -2,13 +2,13 @@
|
|||||||
* @Author: zhaojinfeng 121016171@qq.com
|
* @Author: zhaojinfeng 121016171@qq.com
|
||||||
* @Date: 2023-07-23 16:27:37
|
* @Date: 2023-07-23 16:27:37
|
||||||
* @LastEditors: zhaojinfeng 121016171@qq.com
|
* @LastEditors: zhaojinfeng 121016171@qq.com
|
||||||
* @LastEditTime: 2023-07-23 17:03:29
|
* @LastEditTime: 2023-07-23 17:28:40
|
||||||
* @FilePath: \vue3\packages\mask-text\index.vue
|
* @FilePath: \vue3\packages\mask-text\index.vue
|
||||||
* @Description: 敏感数据隐藏组件
|
* @Description: 敏感数据隐藏组件
|
||||||
*
|
*
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<span :class="{ 'cursor-help': value }" @click="toggle(true)">
|
<span :class="{ 'cursor-help': value }" @click="toggle(false)">
|
||||||
{{ data }}
|
{{ data }}
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
@ -23,17 +23,18 @@ const props = withDefaults(defineProps<{
|
|||||||
right?: number
|
right?: number
|
||||||
}>(), { left: 0, right: 0 })
|
}>(), { left: 0, right: 0 })
|
||||||
|
|
||||||
const [value, toggle] = useToggle(false)
|
const [value, toggle] = useToggle(true)
|
||||||
|
|
||||||
const data = computed(() => {
|
const data = computed(() => {
|
||||||
const left = props.left < 0 ? 0 : props.left
|
const left = props.left < 0 ? 0 : props.left
|
||||||
const right = props.right < 0 ? 0 : props.right
|
const right = props.right < 0 ? 0 : props.right
|
||||||
const textLength = props.text.length
|
const textLength = props.text.length
|
||||||
if (!props.text
|
if (
|
||||||
|
!value.value
|
||||||
|
|| !props.text
|
||||||
|| left > textLength
|
|| left > textLength
|
||||||
|| right > textLength
|
|| right > textLength
|
||||||
|| right + left > textLength
|
|| right + left > textLength
|
||||||
|| value.value
|
|
||||||
)
|
)
|
||||||
return props.text
|
return props.text
|
||||||
const rightIndex = textLength - right
|
const rightIndex = textLength - right
|
||||||
|
Reference in New Issue
Block a user