vue3 在运用 element-plus 中 tooltip组件时,发现 提示信息有时会延迟消失,页面效果显示不友好,如下:
发现使用了 :hide-after =“0” 也没效果
问题现象
办法: 运用 @scroll=“handleScroll” +:disabled 属性来解决
const visible = ref(false)
const handleScroll = () => {
visible.value = true
setTimeout(() => {
visible.value = false
}, 10); // 10 毫秒后提示信息消失
}
给父元素加滚动事件。
初始化默认disabled是false,这样还可以正常使用提示信息。当进行滚动时立即设置为true,这样就会消失了,然后再定时一个较短的时间设置为false,这样就不会影响其他和效果了。