feat(QItem): improve blur target refocusing quasarframework#10510

quasarframework#10510
pdanpdan · Oct 30, 2021 · e465406 · e465406
1 parent 9a97bb2
commit e465406
Showing 1 changed file with 23 additions and 14 deletions.
diff --git a/ui/src/components/item/QItem.js b/ui/src/components/item/QItem.js
@@ -68,6 +68,7 @@ export default Vue.extend({
     onEvents () {
       return {
         ...this.qListeners,
+        focus: this.__onFocus,
         click: this.__onClick,
         keyup: this.__onKeyup
       }
@@ -83,22 +84,14 @@ export default Vue.extend({
       return child
     },
 
+    __onFocus (e) {
+      this.isClickable === true && this.__refocus()
+      this.qListeners.focus !== void 0 && this.qListeners.focus(e)
+    },
+
     __onClick (e) {
       if (this.isClickable === true) {
-        if (
-          this.$q.interaction.isPointer === true &&
-          this.$refs.blurTarget !== void 0 &&
-          document.activeElement === this.$el
-        ) {
-          this.$refs.blurTarget.focus()
-        }
-        else if (
-          this.$q.interaction.isKeyboard === true &&
-          document.activeElement === this.$refs.blurTarget
-        ) {
-          this.$el.focus()
-        }
-
+        this.__refocus()
         this.$emit('click', e)
       }
     },
@@ -113,6 +106,22 @@ export default Vue.extend({
       }
 
       this.$emit('keyup', e)
+    },
+
+    __refocus () {
+      if (
+        this.$q.interaction.isPointer === true &&
+        this.$refs.blurTarget !== void 0 &&
+        document.activeElement === this.$el
+      ) {
+        this.$refs.blurTarget.focus()
+      }
+      else if (
+        this.$q.interaction.isKeyboard === true &&
+        document.activeElement === this.$refs.blurTarget
+      ) {
+        this.$el.focus()
+      }
     }
   },