Select: fix keydown event when composition (#21336)

pull/21019/head
bchen1029 2021-10-12 11:28:51 +08:00 committed by GitHub
parent 6ae261d840
commit 5e037ceaa6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 5 deletions

View File

@ -337,15 +337,18 @@
this.focused = true;
this.$emit('focus', event);
},
handleCompositionStart() {
handleCompositionStart(event) {
this.$emit('compositionstart', event);
this.isComposing = true;
},
handleCompositionUpdate(event) {
this.$emit('compositionupdate', event);
const text = event.target.value;
const lastCharacter = text[text.length - 1] || '';
this.isComposing = !isKorean(lastCharacter);
},
handleCompositionEnd(event) {
this.$emit('compositionend', event);
if (this.isComposing) {
this.isComposing = false;
this.handleInput(event);

View File

@ -52,8 +52,8 @@
@blur="softFocus = false"
@keyup="managePlaceholder"
@keydown="resetInputState"
@keydown.down.prevent="navigateOptions('next')"
@keydown.up.prevent="navigateOptions('prev')"
@keydown.down.prevent="handleNavigate('next')"
@keydown.up.prevent="handleNavigate('prev')"
@keydown.enter.prevent="selectOption"
@keydown.esc.stop.prevent="visible = false"
@keydown.delete="deletePrevTag"
@ -84,11 +84,14 @@
@focus="handleFocus"
@blur="handleBlur"
@input="debouncedOnInputChange"
@keydown.native.down.stop.prevent="navigateOptions('next')"
@keydown.native.up.stop.prevent="navigateOptions('prev')"
@keydown.native.down.stop.prevent="handleNavigate('next')"
@keydown.native.up.stop.prevent="handleNavigate('prev')"
@keydown.native.enter.prevent="selectOption"
@keydown.native.esc.stop.prevent="visible = false"
@keydown.native.tab="visible = false"
@compositionstart="handleComposition"
@compositionupdate="handleComposition"
@compositionend="handleComposition"
@mouseenter.native="inputHovering = true"
@mouseleave.native="inputHovering = false">
<template slot="prefix" v-if="$slots.prefix">
@ -440,6 +443,11 @@
},
methods: {
handleNavigate(direction) {
if (this.isOnComposition) return;
this.navigateOptions(direction);
},
handleComposition(event) {
const text = event.target.value;
if (event.type === 'compositionend') {