fix(client): モバイルでタップしたときにツールチップが表示される問題を修正
This commit is contained in:
		
							parent
							
								
									8e0108a0b8
								
							
						
					
					
						commit
						698e0d08a1
					
				
					 2 changed files with 15 additions and 0 deletions
				
			
		|  | @ -12,6 +12,16 @@ import { resolve } from '@/router'; | ||||||
| import { $i } from '@/account'; | import { $i } from '@/account'; | ||||||
| import { defaultStore } from '@/store'; | import { defaultStore } from '@/store'; | ||||||
| 
 | 
 | ||||||
|  | export let isScreenTouching = false; | ||||||
|  | 
 | ||||||
|  | window.addEventListener('touchstart', () => { | ||||||
|  | 	isScreenTouching = true; | ||||||
|  | }, { passive: true }); | ||||||
|  | 
 | ||||||
|  | window.addEventListener('touchend', () => { | ||||||
|  | 	isScreenTouching = false; | ||||||
|  | }, { passive: true }); | ||||||
|  | 
 | ||||||
| export const stream = markRaw(new Misskey.Stream(url, $i)); | export const stream = markRaw(new Misskey.Stream(url, $i)); | ||||||
| 
 | 
 | ||||||
| export const pendingApiRequestsCount = ref(0); | export const pendingApiRequestsCount = ref(0); | ||||||
|  |  | ||||||
|  | @ -1,3 +1,4 @@ | ||||||
|  | import { isScreenTouching } from '@/os'; | ||||||
| import { Ref, ref } from 'vue'; | import { Ref, ref } from 'vue'; | ||||||
| 
 | 
 | ||||||
| export function useTooltip(onShow: (showing: Ref<boolean>) => void) { | export function useTooltip(onShow: (showing: Ref<boolean>) => void) { | ||||||
|  | @ -10,6 +11,10 @@ export function useTooltip(onShow: (showing: Ref<boolean>) => void) { | ||||||
| 		close(); | 		close(); | ||||||
| 		if (!isHovering) return; | 		if (!isHovering) return; | ||||||
| 
 | 
 | ||||||
|  | 		// iOS(Androidも?)では、要素をタップした直後に(おせっかいで)mouseoverイベントを発火させたりするため、その対策
 | ||||||
|  | 		// これが無いと、画面に触れてないのにツールチップが出たりしてしまう
 | ||||||
|  | 		if (!isScreenTouching) return; | ||||||
|  | 
 | ||||||
| 		const showing = ref(true); | 		const showing = ref(true); | ||||||
| 		onShow(showing); | 		onShow(showing); | ||||||
| 		changeShowingState = () => { | 		changeShowingState = () => { | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue