1回だけ実行すれば十分なイベントリスナーにonceを指定する (#358)

adzukimame · Dec 8, 2024 · 8003d1b · 8003d1b
1 parent 12c6432
commit 8003d1b
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 8 deletions.
diff --git a/packages/frontend/src/components/MkEmojiPicker.section.vue b/packages/frontend/src/components/MkEmojiPicker.section.vue
@@ -17,7 +17,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			:data-emoji="emoji"
 			class="_button item"
 			:disabled="disabledEmojis?.value.includes(emoji)"
-			@pointerenter="computeButtonTitle"
+			@pointerenter.once="computeButtonTitle"
 			@click="emit('chosen', emoji, $event)"
 		>
 			<MkCustomEmoji v-if="emoji[0] === ':'" class="emoji" :name="emoji" :normal="true" :fallbackToImage="true" :forceShowingAnimatedImages="defaultStore.reactiveState.forceShowingAnimatedImagesOnPopup.value"/>
@@ -50,7 +50,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			:data-emoji="emoji"
 			class="_button item"
 			:disabled="disabledEmojis?.value.includes(emoji)"
-			@pointerenter="computeButtonTitle"
+			@pointerenter.once="computeButtonTitle"
 			@click="emit('chosen', emoji, $event)"
 		>
 			<MkCustomEmoji v-if="emoji[0] === ':'" class="emoji" :name="emoji" :normal="true" :forceShowingAnimatedImages="defaultStore.reactiveState.forceShowingAnimatedImagesOnPopup.value"/>

diff --git a/packages/frontend/src/components/MkEmojiPicker.vue b/packages/frontend/src/components/MkEmojiPicker.vue
@@ -66,7 +66,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						class="_button item"
 						:disabled="!canReact(emoji)"
 						tabindex="0"
-						@pointerenter="computeButtonTitle"
+						@pointerenter.once="computeButtonTitle"
 						@click="chosen(emoji, $event)"
 					>
 						<MkCustomEmoji v-if="!emoji.hasOwnProperty('char')" class="emoji" :name="getKey(emoji)" :normal="true" :forceShowingAnimatedImages="defaultStore.reactiveState.forceShowingAnimatedImagesOnPopup.value"/>
@@ -84,7 +84,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 						class="_button item"
 						:disabled="!canReact(emoji)"
 						:data-emoji="getKey(emoji)"
-						@pointerenter="computeButtonTitle"
+						@pointerenter.once="computeButtonTitle"
 						@click="chosen(emoji, $event)"
 					>
 						<MkCustomEmoji v-if="!emoji.hasOwnProperty('char')" class="emoji" :name="getKey(emoji)" :normal="true" :forceShowingAnimatedImages="defaultStore.reactiveState.forceShowingAnimatedImagesOnPopup.value"/>

diff --git a/packages/frontend/src/components/global/MkCustomEmoji.vue b/packages/frontend/src/components/global/MkCustomEmoji.vue
@@ -18,8 +18,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 	:alt="alt"
 	:title="alt"
 	decoding="async"
-	@error="errored = true"
-	@load="errored = false"
+	@error.once="errored = true"
+	@load.once="errored = false"
 	@click="onClick"
 />
 </template>

diff --git a/packages/frontend/src/components/global/MkEmoji.vue b/packages/frontend/src/components/global/MkEmoji.vue
@@ -4,8 +4,8 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<img v-if="!useOsNativeEmojis" :class="$style.root" :src="url" :alt="props.emoji" decoding="async" @pointerenter="computeTitle" @click="onClick"/>
-<span v-else :alt="props.emoji" @pointerenter="computeTitle" @click="onClick">{{ colorizedNativeEmoji }}</span>
+<img v-if="!useOsNativeEmojis" :class="$style.root" :src="url" :alt="props.emoji" decoding="async" @pointerenter.once="computeTitle" @click="onClick"/>
+<span v-else :alt="props.emoji" @pointerenter.once="computeTitle" @click="onClick">{{ colorizedNativeEmoji }}</span>
 </template>
 
 <script lang="ts" setup>