This commit is contained in:
syuilo 2023-01-09 17:04:52 +09:00
parent 1bb2c22493
commit b7dec6e87d

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="omfetrab" :class="['s' + size, 'w' + width, 'h' + height, { asDrawer, asWindow }]" :style="{ maxHeight: maxHeight ? maxHeight + 'px' : undefined }"> <div class="omfetrab" :class="['s' + size, 'w' + width, 'h' + height, { asDrawer, asWindow }]" :style="{ maxHeight: maxHeight ? maxHeight + 'px' : undefined }">
<input ref="search" :value="q" class="search" data-prevent-emoji-insert :class="{ filled: q != null && q != '' }" :placeholder="i18n.ts.search" type="search" @input="input()" @paste.stop="paste" @keyup.enter="done()"> <input ref="searchEl" :value="q" class="search" data-prevent-emoji-insert :class="{ filled: q != null && q != '' }" :placeholder="i18n.ts.search" type="search" @input="input()" @paste.stop="paste" @keyup.enter="done()">
<div ref="emojisEl" class="emojis"> <div ref="emojisEl" class="emojis">
<section class="result"> <section class="result">
<div v-if="searchResultCustom.length > 0" class="body"> <div v-if="searchResultCustom.length > 0" class="body">
@ -105,7 +105,7 @@ const emit = defineEmits<{
}>(); }>();
const customEmojiCategories = getCustomEmojiCategories(); const customEmojiCategories = getCustomEmojiCategories();
const search = shallowRef<HTMLInputElement>(); const searchEl = shallowRef<HTMLInputElement>();
const emojisEl = shallowRef<HTMLDivElement>(); const emojisEl = shallowRef<HTMLDivElement>();
const { const {
@ -268,7 +268,7 @@ watch(q, () => {
function focus() { function focus() {
if (!['smartphone', 'tablet'].includes(deviceKind) && !isTouchUsing) { if (!['smartphone', 'tablet'].includes(deviceKind) && !isTouchUsing) {
search.value?.focus({ searchEl.value?.focus({
preventScroll: true, preventScroll: true,
}); });
} }
@ -308,7 +308,7 @@ function input(): void {
// Using custom input event instead of v-model to respond immediately on // Using custom input event instead of v-model to respond immediately on
// Android, where composition happens on all languages // Android, where composition happens on all languages
// (v-model does not update during composition) // (v-model does not update during composition)
q.value = search.value?.value.trim() ?? ''; q.value = searchEl.value?.value.trim() ?? '';
} }
function paste(event: ClipboardEvent): void { function paste(event: ClipboardEvent): void {