When utilizing the @click directive, an unexpected behavior occurs. If a user presses the mouse button down on an inner element, but releases the button outside of this area (on the mask element), the mask element is unexpectedly closed. This inconsistent behavior can lead to confusion and potentially poor user experience.
Address:
The issue can be traced to the code located at the following GitHub repository and file path:
Description
When utilizing the
@click
directive, an unexpected behavior occurs. If a user presses the mouse button down on an inner element, but releases the button outside of this area (on the mask element), the mask element is unexpectedly closed. This inconsistent behavior can lead to confusion and potentially poor user experience.Address:
The issue can be traced to the code located at the following GitHub repository and file path:
https://github.com/KUN1007/kun-galgame-nuxt3/blob/35858115d407dd11d1d5e323eb38dc9a35bad826/components/kun/search/Search.vue#L89-L90
Solution
Use
@mousedown
instead of@click
.