tcsenpai/swingmusic
1
0
Fork 0
mirror of https://github.com/tcsenpai/swingmusic.git synced 2025-07-29 06:02:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix tooltip being shown when parent is unmounted

Browse Source
This commit is contained in:
geoffrey45 2022-09-04 16:07:05 +03:00
parent b7c158a785
commit de1c232973
2 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/assets/scss/Global/basic.scss
View File

@ -117,7 +117,12 @@ button {
border-radius: $smaller; border-radius: $smaller;
padding: $smaller; padding: $smaller;
font-size: 0.85rem; font-size: 0.85rem;
display: none; visibility: hidden;
position: absolute; position: absolute;
z-index: 300; z-index: 300;
} }
#tooltip[data-popper-reference-hidden] {
visibility: hidden !important;
pointer-events: none;
}

11
src/directives/vTooltip.ts
View File

@ -14,7 +14,7 @@ export default {
setTimeout(() => { setTimeout(() => {
if (isHovered) { if (isHovered) {
tooltip.innerText = binding.value; tooltip.innerText = binding.value;
tooltip.style.display = "unset"; tooltip.style.visibility = "visible";
createPopper(el, tooltip, { createPopper(el, tooltip, {
placement: "top", placement: "top",
@ -25,6 +25,10 @@ export default {
offset: [0, 10], offset: [0, 10],
}, },
}, },
{
name: "hide",
enabled: true,
},
], ],
}); });
} }
@ -33,14 +37,15 @@ export default {
el.addEventListener("mouseout", () => { el.addEventListener("mouseout", () => {
isHovered = false; isHovered = false;
tooltip.style.display = "none"; tooltip.style.visibility = "hidden";
}); });
}, },
beforeUnmount(el: HTMLElement) { beforeUnmount(el: HTMLElement) {
const tooltip = document.getElementById("tooltip") as HTMLElement; const tooltip = document.getElementById("tooltip") as HTMLElement;
tooltip.style.display = "none"; tooltip.style.visibility = "hidden";
el.removeEventListener("mouseover", () => {}); el.removeEventListener("mouseover", () => {});
el.removeEventListener("mouseout", () => {}); el.removeEventListener("mouseout", () => {});
}, },
} as Directive; } as Directive;