diff --git a/ui/src/components/input/QInput.js b/ui/src/components/input/QInput.js index 8fe2f9d25f5b..d1a71992e30c 100644 --- a/ui/src/components/input/QInput.js +++ b/ui/src/components/input/QInput.js @@ -162,6 +162,12 @@ export default Vue.extend({ e.target.composing = true }, + __onCompositionUpdate (e) { + if (typeof e.data === 'string' && e.data.codePointAt(0) < 256) { + e.target.composing = false + } + }, + __onCompositionEnd (e) { if (e.target.composing !== true) { return } e.target.composing = false @@ -189,6 +195,10 @@ export default Vue.extend({ blur: stop } + if (this.$q.platform.is.android === true) { + on.compositionupdate = this.__onCompositionUpdate + } + if (this.hasMask === true) { on.keydown = this.__onMaskedKeydown } diff --git a/ui/src/components/select/QSelect.js b/ui/src/components/select/QSelect.js index 2f080d0e27f1..ca5d65b30236 100755 --- a/ui/src/components/select/QSelect.js +++ b/ui/src/components/select/QSelect.js @@ -798,6 +798,12 @@ export default Vue.extend({ e.target.composing = true }, + __onCompositionUpdate (e) { + if (typeof e.data === 'string' && e.data.codePointAt(0) < 256) { + e.target.composing = false + } + }, + __onCompositionEnd (e) { if (e.target.composing !== true) { return } e.target.composing = false @@ -806,6 +812,22 @@ export default Vue.extend({ }, __getInput (h) { + const on = { + input: this.__onInputValue, + // Safari < 10.2 & UIWebView doesn't fire compositionend when + // switching focus before confirming composition choice + // this also fixes the issue where some browsers e.g. iOS Chrome + // fires "change" instead of "input" on autocomplete. + change: this.__onCompositionEnd, + compositionstart: this.__onCompositionStart, + compositionend: this.__onCompositionEnd, + keydown: this.__onTargetKeydown + } + + if (this.$q.platform.is.android === true) { + on.compositionupdate = this.__onCompositionUpdate + } + return h('input', { ref: 'target', staticClass: 'q-select__input q-placeholder col', @@ -819,17 +841,7 @@ export default Vue.extend({ ...this.$attrs, disabled: this.editable !== true }, - on: { - input: this.__onInputValue, - // Safari < 10.2 & UIWebView doesn't fire compositionend when - // switching focus before confirming composition choice - // this also fixes the issue where some browsers e.g. iOS Chrome - // fires "change" instead of "input" on autocomplete. - change: this.__onCompositionEnd, - compositionstart: this.__onCompositionStart, - compositionend: this.__onCompositionEnd, - keydown: this.__onTargetKeydown - } + on }) },