Autocomplete input "fake" input event

1

Hi.
I created a wrapper component around an f7-input bound to an autocomplete instance (created on the mounted hook).
This is its html:

<template>
  <f7-input type="text" :value="value" :input-id="id" @input="$emit('input',$event)">
</template>

Please note the re-emitter for the input event.

It works correctly for each input event, but it also emits an event on the input focus; this event is not even an InputEvent instance, it’s just random.

So when i use my wrapper component autocomplete-maps like this:

<autocomplete-maps @input="log('input ac', $event)"></autocomplete-maps>

You can see in the following screenshot that the first event logged is not a real input event. In fact, it is just me clicking on the input and giving it focus.
image

Is this the intended behaviour?

have a nice day

2

PS: i temporarily resorted on filtering the input events and re-emitting only the real ones:

<f7-input type="text" :value="value" :input-id="id" @input="emitInput">
...
    emitInput($event) {
      if ($event instanceof InputEvent) {
        this.$emit('input', $event);
      }
    },

but this is just a workaround obviously

3

Yes, it is intended, because it is required to trigger input event on focus (when autocomplete gets activated)

4

Oh ok i see.

Is my filtering correct with: if ($event instanceof InputEvent) ?

5

Yes, it is should be fine

1 Like